Extjs Tabpanel调整大小

时间:2012-10-01 14:44:44

标签: extjs tabpanel

我已经实现了一个包含两个网格的EXTJS 4.0 tabpanel。

首次加载时,这一切都运行正常。但是,当我转到另一个面板(不是tabpanel的孩子),然后在视口中重新加载tabpanel或调整我的浏览器窗口大小时,HTML子homeclients(我的网格)消失(并且它的HTML元素从tabpanel中删除)。

enter image description here

有人知道为什么会这样吗?

的TabPanel:

Ext.define('EY.view.center.home.container.Panel', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.containerhome',
    id: 'containerhome',
    activeTab: 1,

    border: false,
    resizeTabs:true,

     items: [{
            title: 'Most Used clients',
            iconCls: 'tabIcon',
            xtype: 'mostUsedClients',
            id: 'mostUsedClients',
            scale: 'large'
        },{
                title: 'All Clients',
                xtype: 'homeclients',
                id: 'homeclients',
                scale: 'large'
            }
        ],
    requires: [
        'EY.view.center.home.client.Grid',
         'EY.view.center.home.client.mostUsedClients.mostUsedClients'
],


    initComponent: function () {
        Ext.apply(this, {



        })
        this.callParent(arguments);
    }
});

网格:

Ext.define('EY.view.center.home.client.Grid', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.homeclients',
    id: 'homeclients',
    baseCls: 'homeclients',
    //frame:true,
    store: 'Clients', //Ext.data.StoreManager.lookup('serviceStore'),
    contextMenu: undefined,

    border: false,
    //flex: 1,
    padding: 3,
    hideHeaders: true,

    columns: [
        { header: 'CLIENTS', field: 'textfield', flex: 1 }

        ],


    features: [
        Ext.create('Ext.grid.feature.RowBody', {
            getAdditionalData: function (data, rowIndex, rec, orig) {
                var headerCt = this.view.headerCt;
                var colspan = headerCt.getColumnCount();
                return {

                    rowBody: createHtml(rec),
                    rowBodyCls: this.rowBodyCls,
                    rowBodyColspan: colspan
                };
            }
        }),
         {
             ftype: 'rowwrap'
         }
    ],



    viewConfig: {
        listeners: {
            itemclick: function (list, index, target, record, event) {
                if (event.target.id == 'grandAccess') {

                    var windowIsClosed = Ext.getCmp('ConfirmationWindow');
                    if (!windowIsClosed) {
                        var clientId = index.data.id;
                        var clientVat = index.data.rn;
                        eDocsUser.currentClientName = index.data.n;
                        eDocsUser.currentClientId = clientId;
                        eDocsUser.currentClientRegisterNummer = clientVat;

                        showGrantAccesWindow(index);
                    }
                } else {

                    if (Ext.getCmp('ConfirmationWindow')) {
                        Ext.getCmp('ConfirmationWindow').hide();
                    }
                    loadDataOfSelectedClient(index);
                }

            }
        }
    },





    initComponent: function () {


        this.callParent(arguments);

    }
});

1 个答案:

答案 0 :(得分:0)

我们通过将网格更改为数据视图以解决调整大小问题来解决这个问题(网格导致我遇到很多问题)。

然后我们通过改变来解决另一个问题:

layout.setActiveItem(Ext.getCmp('containerhome'), {
                                type: 'slide',
                                direction: 'left',
                                duration: 5000
                            });

layout.setActiveItem(0);

我们(但不是我......:D)创建了一个新项目,而不是在卡片面板中调用旧项目。