Results 1 to 7 of 7

Thread: Form Panel into Panel don't work

  1. #1
    Sencha Premium Member fabio.policeno's Avatar
    Join Date
    Sep 2010
    Posts
    356
    Answers
    18
    Vote Rating
    5
      0  

    Default Answered: Form Panel into Panel don't work

    Because it don't worked?
    Not show the formpanel.
    Code:
    Ext.regApplication({
        name         : 'Example',
        
        launch: function(){
            new Ext.Panel({
                fullscreen : true,
                dockedItems: [{
                    xtype: 'toolbar',
                    title: 'Standard Titlebar'
                }],
                items       : [{
                    xtype: 'formpanel',
                    items: [{
                        name       : 'nome',
                        label       : 'Nome'
                    }]
                }]
            });
        } 
    });
    Thank's!

  2. Try using fit layout on the Panel... also, why not unnest the form and have it fullscreen?

  3. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,326
    Answers
    3884
    Vote Rating
    1297
      0  

    Default

    Try using fit layout on the Panel... also, why not unnest the form and have it fullscreen?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha Premium Member fabio.policeno's Avatar
    Join Date
    Sep 2010
    Posts
    356
    Answers
    18
    Vote Rating
    5
      0  

    Default

    Quote Originally Posted by mitchellsimoens View Post
    Try using fit layout on the Panel...
    Not show formPanel:
    Code:
    Ext.regApplication({
        name         : 'Example',
        
        launch: function(){
            new Ext.Panel({
                fullscreen : true,
                layout       : 'fit',
                dockedItems: [{
                    xtype: 'toolbar',
                    title: 'Standard Titlebar'
                }],
                items       : [{
                    xtype: 'formpanel',
                    items: [{
                        name       : 'nome',
                        label       : 'Nome'
                    }]
                }]
            });
        } 
    });
    Quote Originally Posted by mitchellsimoens View Post
    also, why not unnest the form and have it fullscreen?
    The panel is already with fullscreen

  5. #4
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,326
    Answers
    3884
    Vote Rating
    1297
      0  

    Default

    2 things I see wrong:

    1. Ext.regApplication is a Sencha Touch 1 thing, not valid in Sencha Touch 2
    2. dockedItems should not be used anymore


    This works in ST2 PR1:

    Code:
    Ext.application({
        name         : 'Example',
    
        launch: function(){
            new Ext.Panel({
                fullscreen : true,
                layout       : 'fit',
                items       : [
                    {
                        xtype  : 'toolbar',
                        docked : 'top',
                        title  : 'Standard Titlebar'
                    },
                    {
                        xtype: 'formpanel',
                        items: [
                            {
                                name       : 'nome',
                                label       : 'Nome'
                            }
                        ]
                    }
                ]
            });
        }
    });
    You can that Ext.regApplication has been replaced by Ext.application. You can also see that your toolbar is now within the items array and with a config docked : 'top' to tell it where to dock.
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #5
    Sencha Premium Member fabio.policeno's Avatar
    Join Date
    Sep 2010
    Posts
    356
    Answers
    18
    Vote Rating
    5
      0  

    Default

    Sorry, I'm actually aware of it, I made an example of this for each version (1, 2PR1, 2PR2), but I ended up posting the wrong code, finally, I tested your code in version 1, 2PR1, 2PR2 and simply FormPanel does not appear, only the tollbar.

    Code:
    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        
        <link rel="stylesheet" href="touch/resources/css/sencha-touch.css" type="text/css">
        <script type="text/javascript" src="touch/sencha-touch-all-debug.js"></script>
        
        <script type="text/javascript" src="contato/app.js"></script>    
    </head>
    <body></body>
    </html>
    Code:
    Ext.application({
        name         : 'Example',
    
        launch: function(){
            new Ext.Panel({
                fullscreen : true,
                layout       : 'fit',
                items       : [
                    {
                        xtype  : 'toolbar',
                        docked : 'top',
                        title  : 'Standard Titlebar'
                    },
                    {
                        xtype: 'formpanel',
                        items: [
                            {
                                name       : 'nome',
                                label       : 'Nome'
                            }
                        ]
                    }
                ]
            });
        }
    });
    Thank you!

    Sem título.jpg

  7. #6
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,326
    Answers
    3884
    Vote Rating
    1297
      0  

    Default

    Looks like Ext.form.Panel doesn't have defaultType anymore so you can add defaultType to the formpanel or xtype on your fields... or both.

    Code:
    Ext.application({
        name         : 'Example',
    
        launch: function() {
            Ext.create('Ext.Panel', {
                fullscreen : true,
                layout     : 'fit',
                items      : [
                    {
                        xtype  : 'toolbar',
                        docked : 'top',
                        title  : 'Standard Titlebar'
                    },
                    {
                        xtype       : 'formpanel',
                        defaultType : 'textfield',
                        items       : [
                    {
                        //xtype : 'textfield',
                        name  : 'name',
                        label : 'Name'
                    }
                ]
            }
        ]
    });
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  8. #7
    Sencha Premium Member fabio.policeno's Avatar
    Join Date
    Sep 2010
    Posts
    356
    Answers
    18
    Vote Rating
    5
      0  

    Default



    Actually, I made an example to illustrate part of the problem and ended up taking the defaultType not realized, the sample went to work, now I'm back to my application and even setting the defaultType did not work, then tried putting layout: 'fit' and it worked . Finally, the initial problem was the lack of layout: 'fit', thank you and sorry for not spotting the mistake of missing the xtype, the problem is that over the long code that does not just spotting things extremely simple.


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •