Looks like we cannot reproduce this. Please provide another test case to reproduce this issue.
  1. #1
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    43
    Vote Rating
    0
    manlsea is on a distinguished road

      0  

    Default The grid panel disappears after it expanded.

    The grid panel disappears after it expanded.


    Environment:Extjs 4.1.0 & Extjs 4.1.1RC2; Firefox & Chromium;
    There are two grid in the customers tab;
    The contacts grid config: {region: 'south', collapsible: true, split: true, collapsed: true};
    The grid disappears after it expanded.
    2012-06-21.png
    CustomerContacts.js
    Code:
    Ext.define('App.view.CustomerContacts', {
        extend: 'Ext.panel.Panel',
        alias: 'widget.customerslist',
        
        initComponent: function () {
            
            Ext.apply(this, {
                layout: 'border',
                border: false,
                items: [
                        {xtype: 'customersgrid', region: 'center', border: false },
                        {xtype: 'contactsgrid', region: 'south', collapsible: true, split: true, border: false, height: 300, collapsed: true}
                        
                       ] 
    
    
            });
            
            this.callParent(arguments);
        }
    });
    ContactsGrid.js
    Code:
    Ext.define('App.view.ContactsGrid', {
        extend: 'Ext.grid.Panel',
        alias: 'widget.contactsgrid',
        title: columnsTextArr[31],
        border: true,
        selModel: { selType: 'checkboxmodel', mode: 'MULTI', checkOnly: true }, //添加checkbox列 SIMPLE MULTI SINGLE
        
    
    
        initComponent: function () {
            var createAction = Ext.create('Ext.Action', {
                
                scope: this,
                iconCls: 'iconAdd',
                text: actions[0],
                action: 'create',
                disabled: true,
                handler: function (bt, ck) {
                    editContact();
                }
            });
            var editContact = function (record) {
                var cstm = Ext.widget('contactwindow',{animateTarget: 'targetContact', unSaveable: editAction.isDisabled()});
                if (record) {
                    cstm.down('form').loadRecord(record);
                    cstm.setIconCls('iconFeedEdit');
                    cstm.setTitle('Edit Contact');
                }
            };
            var removeAction = Ext.create('Ext.Action', {
                
                scope: this,
                iconCls: 'iconAllDelete',
                text: actions[3],
                action: 'remove',
                disabled: true,
                handler: function (bt, ck) {
                    
                    var selections = this.getSelectionModel().getSelection();
                    if (selections.length > 0) {
                        var store = this.store;
                        Ext.Msg.show({
                            title: 'Warning',
                            msg: actions[24],
                            buttons: Ext.Msg.OKCANCEL,
                            icon: Ext.Msg.QUESTION,
                            fn: function (btn, text) {
                                if (btn == 'ok') {
                                    store.remove(selections);
                                    store.sync();
                                }
                            }
                        });
                    }
                }
            });
            var editAction = Ext.create('Ext.Action', {
                
                scope: this,
                iconCls: 'iconEdit',
                text: actions[1],
                action: 'edit',
                disabled: true,
                handler: function (bt, ck) {
                    var selections = this.getSelectionModel(); 
                    if (selections.getSelection().length > 0) {
                        selections = selections.getLastSelected();
                        editContact(selections);
                    }
                }
    
    
            });
    
    
            var refreshAction = Ext.create('Ext.Action', {
                
                scope: this,
                iconCls: 'iconRefresh',
                text: actions[11],
                action: 'refresh',
                disabled: false,
                handler: function (bt, ck) {
                    this.store.load();
                }
            });
            
            var slmd = Ext.getCmp('AppMenu');
            slmd = slmd.getSelectionModel().getLastSelected(); 
            if (slmd) {
                if (slmd.get('addp'))
                    createAction.enable();
                if (slmd.get('upp'))
                    editAction.enable();
                if (slmd.get('delp'))
                    removeAction.enable();
            };
            
            var contextMenu = Ext.create('Ext.menu.Menu', {
                scope: this,
                items: [ createAction, editAction, refreshAction, '-', removeAction]
            });
            
            
            Ext.apply(this, {
                tbar: [createAction, '-', editAction, '-', refreshAction, '->', removeAction],
                store: contactStore,
                bbar: { xtype: 'pagingtoolbar', store: contactStore, displayInfo: true,
                    items: ['-', { typeAhead: true, width: 100, queryMode: 'local', labelWidth: 30, fieldLabel: 'Size', xtype: 'combobox', editable: false, displayField: 'name', store: pageSize, value: initialPageSize,
                        listeners: { change: function (cmbx, newValue, oldValue, eOpts) {
                            this.up('grid').store.pageSize = newValue;
                        }
                        }
                    },  { xtype: 'tbtext', id: 'targetContact'}]
                },
        columns: [
        { text: 'SN', xtype: 'rownumberer', width: 26 },
        { text: columnsTextArr[0], dataIndex: 'rname' }, 
        { text: columnsTextArr[1], dataIndex: 'call', flex: 1},
        { text: columnsTextArr[2], dataIndex: 'email' },
        { text: columnsTextArr[6], dataIndex: 'telephone' },
        { text: columnsTextArr[7], dataIndex: 'extension' },
        { text: columnsTextArr[37], dataIndex: 'fax' },
        { text: columnsTextArr[8], dataIndex: 'mobile' },
        { text: columnsTextArr[38], dataIndex: 'language' },
        { text: columnsTextArr[4], dataIndex: 'online', renderer: formatOnLine, align: 'center', width: 60 },
        { text: columnsTextArr[39], dataIndex: 'allowlogon' , width: 60, xtype: 'booleancolumn', trueText: 'Yes', falseText: 'No'},
        { text: columnsTextArr[9], dataIndex: 'errorcount', width: 70, align: 'right', renderer: formatErrorTimes },
        { text: columnsTextArr[5], dataIndex: 'lastaction', width: 150}],
        
           viewConfig: {
                    stripeRows: true,
                    listeners: {
                        itemcontextmenu: function (view, rec, node, index, e) {
                            e.stopEvent();
                            contextMenu.showAt(e.getXY());
                            return false;
                        }
                    }
                }
            });
            this.on('itemdblclick', function (view, rec, node, index, e) {
                    editContact(rec);
              });
            this.callParent(arguments);
    
    
        }
    });
    CustomersGrid.js
    Code:
    
    Ext.define('App.view.CustomersGrid', {
        extend: 'Ext.grid.Panel',
        alias: 'widget.customersgrid',
        border: true,
        selModel: { selType: 'checkboxmodel', mode: 'MULTI', checkOnly: true }, 
        
        initComponent: function () {
            var createAction = Ext.create('Ext.Action', {
                scope: this,
                iconCls: 'iconAdd',
                text: actions[0],
                action: 'create',
                disabled: true,
                handler: function (bt, ck) {
                    editCustomer();
                }
            });
            var editCustomer = function (record) {
                var cstm = Ext.widget('customerwindow',{animateTarget: 'targetCustomer', unSaveable: editAction.isDisabled()});
                if (record) {
                    contactStore.getProxy().extraParams['cstid'] = record.getId();
                    contactStore.load();
                    cstm.down('form').loadRecord(record);
    
    
                } else {
                    contactStore.removeAll();
                    cstm.setIconCls('iconFeed');
                    cstm.setTitle('New Customer');
                }
            };
            var removeAction = Ext.create('Ext.Action', {
                scope: this,
                iconCls: 'iconAllDelete',
                text: actions[3],
                action: 'remove',
                disabled: true,
                handler: function (bt, ck) {
                    
                    var selections = this.getSelectionModel().getSelection();
                    if (selections.length > 0) {
                        var store = this.store;
                        Ext.Msg.show({
                            title: 'Warning',
                            msg: actions[24],
                            buttons: Ext.Msg.OKCANCEL,
                            icon: Ext.Msg.QUESTION,
                            fn: function (btn, text) {
                                if (btn == 'ok') {
                                    store.remove(selections);
                                    store.sync();
                                }
                            }
                        });
                    }
                }
            });
            var editAction = Ext.create('Ext.Action', {
                scope: this,
                iconCls: 'iconEdit',
                text: actions[1],
                action: 'edit',
                disabled: true,
                handler: function (bt, ck) {
                    var selections = this.getSelectionModel(); 
                    if (selections.getSelection().length > 0) {
                        selections = selections.getLastSelected();
                        editCustomer(selections);
                    }
                }
    
    
            });
    
    
            var refreshAction = Ext.create('Ext.Action', {
                scope: this,
                iconCls: 'iconRefresh',
                text: actions[11],
                action: 'refresh',
                disabled: false,
                handler: function (bt, ck) {
                    this.store.load();
                }
            });
            var getMoreAction = Ext.create('Ext.Action', {
                scope: this,
                iconCls: 'iconAddRead',
                text: actions[4],
                action: 'getMore',
                disabled: false,
                handler: function (widget, event) {
                    var store = this.store;
                    var cp = store.getCount();
                    if (cp == 0) {
                        store.load();
    
    
                    } else {
                        cp = store.getTotalCount();
                        cpc = store.currentPage;
                        cps = store.pageSize;
                        if (cp > cpc * cps) {
                            store.clearOnPageLoad = false;
                            store.nextPage();
                            store.clearOnPageLoad = true;
                        } else {
                            Ext.Msg.show({
                                title: 'Message',
                                msg: 'Reached the last page.',
                                icon: Ext.Msg.WARNING,
                                buttons: Ext.Msg.OK
                            });
                        }
                    }
                }
            });
    
    
            var slmd = Ext.getCmp('AppMenu');
            slmd = slmd.getSelectionModel().getLastSelected(); 
            if (slmd) {
                if (slmd.get('addp'))
                    createAction.enable();
                if (slmd.get('upp'))
                    editAction.enable();
                if (slmd.get('delp'))
                    removeAction.enable();
            };
            
            var contextMenu = Ext.create('Ext.menu.Menu', {
                scope: this,
                items: [ createAction, editAction, refreshAction, getMoreAction, '-', removeAction]
            });
            
            if(partUsersStore==null){
             partUsersStore = Ext.create('App.store.PartUsers', { autoLoad: false, autoSync: false });
             
            partCustomerStore = stringHead(currUser.userType, true)
            if (partCustomerStore == '2') {
                partUsersStore.getProxy().extraParams['part'] = 'groupid';
                partUsersStore.getProxy().extraParams['key'] = stringHead(currUser.userGD, true); 
            }
            else if (partCustomerStore == '3') {
                partUsersStore.getProxy().extraParams['part'] = 'departmentid';
                partUsersStore.getProxy().extraParams['key'] = stringHead(currUser.userGD, false).substring(1);
            }
            else {
                partUsersStore.getProxy().extraParams['part'] = 'id';
                partUsersStore.getProxy().extraParams['key'] = stringHead(currUser.user, true);
            }
            partCustomerStore = Ext.create('App.store.Customers', { autoLoad: false, autoSync: false });
            partCustomerStore.getProxy().extraParams['part'] = partUsersStore.getProxy().extraParams['part'];
            partCustomerStore.getProxy().extraParams['key'] = partUsersStore.getProxy().extraParams['key'];
            partUsersStore.load();
            partCustomerStore.load();
            }
            if(contactStore==null){
             contactStore = Ext.create('App.store.Contacts', { autoLoad: false, autoSync: false });
             }
            Ext.apply(this, {
                tbar: [createAction, '-', editAction, '-', refreshAction, '->', removeAction],
                store: partCustomerStore,
                bbar: { xtype: 'pagingtoolbar', store: partCustomerStore, displayInfo: true,
                    items: ['-', { typeAhead: true, width: 100, queryMode: 'local', labelWidth: 30, fieldLabel: 'Size', xtype: 'combobox', editable: false, displayField: 'name', store: pageSize, value: initialPageSize,
                        listeners: { change: function (cmbx, newValue, oldValue, eOpts) {
                            this.up('grid').store.pageSize = newValue;
                        }
                        }
                    }, '-', getMoreAction, { xtype: 'tbtext', id: 'targetCustomer'}]
                },
                columns: [
        { text: 'SN', xtype: 'rownumberer', width: 26 },
        { text: columnsTextArr[12], dataIndex: 'rname' }, 
        {text: columnsTextArr[21], dataIndex: 'fullname', flex: 1},
        { text: columnsTextArr[23], dataIndex: 'web' },
        { text: columnsTextArr[22], dataIndex: 'countryid', renderer: formatCountry },
        { text: columnsTextArr[25], dataIndex: 'regionid', renderer: formatRegion },
        { text: columnsTextArr[26], dataIndex: 'code' },
        { text: columnsTextArr[32], dataIndex: 'bank' },
        { text: columnsTextArr[27], dataIndex: 'ownerid', renderer: formatUser },
        { text: columnsTextArr[28], dataIndex: 'createrid', renderer: formatUser },
        { text: columnsTextArr[29], dataIndex: 'ispartner', width: 60, xtype: 'booleancolumn', trueText: 'Yes', falseText: 'No' },
        { text: columnsTextArr[30], dataIndex: 'createdate', width: 150}],
        
                viewConfig: {
                    stripeRows: true,
                    listeners: {
                        itemcontextmenu: function (view, rec, node, index, e) {
                            e.stopEvent();
                            contextMenu.showAt(e.getXY());
                            return false;
                        }
                    }
                }
            });
            this.on('itemdblclick', function (view, rec, node, index, e) {
                    editCustomer(rec);
              });
            this.callParent(arguments);
        }
    });
    Turn off the animation effects can resolve the issue.
    animCollapse: false,
    Last edited by manlsea; 25 Jun 2012 at 10:33 PM. Reason: Resolved

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,918
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Last edited by manlsea; Today at 1:33 AM. Reason: Resolved
    Is this resolved, or a workaround and it still needs attention?

    Scott.

  3. #3
    Sencha User
    Join Date
    Apr 2010
    Location
    China
    Posts
    43
    Vote Rating
    0
    manlsea is on a distinguished road

      0  

    Default


    You are right, it still needs attention. because the problem still remains, turn off the dynamic effects, just a way to avoid the error occurred.

  4. #4
    Sencha - Ext JS Dev Team dongryphon's Avatar
    Join Date
    Jul 2009
    Posts
    1,337
    Vote Rating
    130
    dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all dongryphon is a name known to all

      0  

    Default


    Thanks - I've moved this to the Bugs forum and will open a ticket.
    Don Griffin
    Ext JS Development Team Lead

    Check the docs. Learn how to (properly) report a framework issue and a Sencha Cmd issue

    "Use the source, Luke!"

  5. #5
    Sencha - Ext JS Dev Team evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    16,803
    Vote Rating
    605
    evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute evant has a reputation beyond repute

      0  

    Default


    There's too many missing parts in your test case to run it directly, so I tried to simulate it and I can't reproduce it with 4.1.1. Please post a test case that I can run locally that demonstrates the issue.

    My sample:

    Code:
    Ext.define('MyModel', {
        extend: 'Ext.data.Model',
        fields: ['name']
    });
    
    Ext.require('*');
    
    Ext.onReady(function() {
        var store = Ext.create('Ext.data.Store', {
            model: MyModel,
            data: [{
                name: 'Item 1'
            }]
        });
        
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: {
                xtype: 'tabpanel',
                items: [{
                    title: 'A tab',
                    layout: 'border',
                    items: [{
                        title: 'Center',
                        region: 'center',
                        xtype: 'gridpanel',
                        store: store,
                        columns: [{
                            dataIndex: 'name',
                            text: 'Name'
                        }]
                    }, {
                        title: 'South',
                        region: 'south',
                        xtype: 'gridpanel',
                        store: store,
                        columns: [{
                            dataIndex: 'name',
                            text: 'Name'
                        }],
                        height: 200,
                        collapsible: true,
                        collapsed: true,
                        split: true
                    }]
                }]
            }    
        });
    });
    Evan Trimboli
    Sencha Developer
    Twitter - @evantrimboli
    Don't be afraid of the source code!

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi