1. #1
    Sencha User
    Join Date
    Jun 2011
    Posts
    55
    Vote Rating
    0
    Gabanjo is on a distinguished road

      0  

    Default Layout problems with editable grids

    Layout problems with editable grids


    An editable grid that was working fine in 4.0.7, has problems in betas 1-3. (The demos work fine, so I'm wondering what I'm doing wrong.)

    These are the symptoms:
    On the first double-click on the grid:
    'Uncaught Ext.Error : ext-com-1024<container> cannot set width' console errors (running with Context.js)
    a 'ghost' editable input area appears on the top left of the browser area.
    you need to double-click again to get the editor
    the editable area of the first column is about 100px short of the column width, the editable area of the second column is even shorter.
    On subsequent double-clicks, the only symptom is the width of the editable areas.

    Here is the code:

    Code:
    Ext.onReady(function(){
        var store =    Ext.create('Ext.data.Store', {
            fields : [
            {name : 'name' , type : 'string'},
            {name : 'description',type : 'string'},
            ],
               data : [
                 { name : 'n1', description : 'd1'},
                 { name : 'n2', description : 'd2'}
               ]
        });
        var window = Ext.widget('window', {
            width: 500,
            height: 600,
            layout: 'fit',
            id : 'idTesting',
            title: 'Hello Dialog (' + Ext.versions.extjs.version + ')',
            items: [
             { xtype : 'panel',
               layout : 'border',
               items : [
                 {
                  xtype : 'grid',
                              title : 'Grid',
                  frame : true,
                  region : 'center',
                  selType : 'cellmodel',
                  store : store,
                  columns : [
                      Ext.create('Ext.grid.RowNumberer'),
                      { header : 'Name', dataIndex : 'name',   flex : .5, editor : { xtype :'textfield'}},
                      { header : 'Description', dataIndex : 'description',  flex : .5,editor : {xtype :'textfield'}}
                  ],
                  plugins : [
                      Ext.create('Ext.grid.plugin.CellEditing', { clicksToEdit : 2 })
                  ],
                }
             ]
           }
          ]
        });
        window.show();
    })
    Any help would be appreciated.

    (Tested on Chrome 17 and Firefox 10.)

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,329
    Vote Rating
    847
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    With your code, I do not get any errors in Chrome or FF.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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.

  3. #3
    Sencha User
    Join Date
    Jun 2011
    Posts
    55
    Vote Rating
    0
    Gabanjo is on a distinguished road

      0  

    Default


    That surprised me. Just to show I'm not going mad I've attached a screenshot of the console.

    In the meantime I'll try to figure what's going on.
    Attached Images

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,329
    Vote Rating
    847
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    In your search, I would also try different ext js build files like allow Ext.Loader to load files dynamically using ext-debug.js
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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.

  5. #5
    Sencha User
    Join Date
    Jun 2011
    Posts
    55
    Vote Rating
    0
    Gabanjo is on a distinguished road

      0  

    Default


    This is from my testing page (with different root directories for the various releases):

    Code:
        <link rel="stylesheet" type="text/css" href="/ext-4.1.0-beta-2/resources/css/ext-all.css">
        <script type="text/javascript" src="/ext-4.1.0-beta-2/ext-all-dev.js"></script>
        <script type="text/javascript" src="/ext-4.1.0-beta-2/src/diag/layout/Context.js"></script>
        <script type="text/javascript" src="/ext-4.1.0-beta-2/src/diag/layout/ContextItem.js"></script>
    If I remove the last two lines everything works fine.

    Good to know it was something I was doing.

Thread Participants: 1