2012-06-05 47 views
0

我试图解释我的问题。我有一个标签面板。在一个选项卡中,我有一个表单面板和一个网格面板,两者都可折叠。当我折叠表单面板时,它会崩溃,当我折叠网格面板都崩溃了。现在,当我将两个面板中的一个展开时,另一个消失。这可能是什么?面板在extjs崩溃时隐藏

Ext.define('MyApp.view.TMS', { 
    extend: 'Ext.container.Viewport', 

    id: 'tmsViewport', 
    layout: { 
     type: 'border' 
    }, 

    initComponent: function() { 
     var me = this; 

     Ext.applyIf(me, { 
      items: [{ 
       xtype: 'tabpanel', 
       id: 'mainTab', 
       activeTab: 0, 
       region: 'center', 
       items: [{ 
        xtype: 'panel', 
        id: 'configurationTab', 
        title: 'Configuration', 
        items: [{ 
         xtype: 'tabpanel', 
         id: 'configurationVehicles', 
         title: 'configuration', 
         activeTab: 0, 
         items: [{ 
          xtype: 'panel', 
          id: 'configurationDrivers', 
          collapsed: false, 
          title: 'Drivers', 
          items: [{ 
           xtype: 'form', 
           floating: false, 
           height: 400, 
           id: 'configurationDriversConfiguration', 
           itemId: 'configurationDriversConfiguration', 
           bodyPadding: 10, 
           animCollapse: false, 
           collapsed: false, 
           collapsible: true, 
           title: 'Driver Configuration', 
           items: [{ 
            xtype: 'button', 
            id: 'configurationDriversAdd', 
            text: 'Add' 
           }, { 
            xtype: 'button', 
            id: 'configurationDriversDelete', 
            text: 'Delete' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversCode', 
            fieldLabel: 'Driver Code' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversName', 
            fieldLabel: 'Driver Name' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversLicense', 
            fieldLabel: 'Driver License nr' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversGivenName', 
            fieldLabel: 'Driver Given Name' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversFamilyName', 
            fieldLabel: 'Driver Familiy Name' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversPhone', 
            fieldLabel: 'Driver Phone Nr' 
           }, { 
            xtype: 'textfield', 
            id: 'configurationDriversEmail', 
            fieldLabel: 'Driver Email' 
           }, { 
            xtype: 'combobox', 
            id: 'configurationDriversProvider', 
            fieldLabel: 'Provider', 
            displayField: 'name', 
            store: 'comboProviders', 
            valueField: 'id' 
           }, { 
            xtype: 'textareafield', 
            id: 'configurationDriversMemo', 
            fieldLabel: 'Memo' 
           }, { 
            xtype: 'button', 
            handler: function (button, event) { 
             var form = document.forms; 

             Ext.MessageBox.alert('Submitted Values', form.getValues(true)); 


            }, 
            height: 37, 
            id: 'configurationDriversSave', 
            text: 'Save' 
           }] 
          }, { 
           xtype: 'gridpanel', 
           height: 300, 
           id: 'configurationDriversGrid', 
           itemId: 'configurationDriversGrid', 
           animCollapse: false, 
           collapsible: true, 
           title: 'Drivers', 
           store: 'gridDrivers', 
           viewConfig: { 

           }, 
           columns: [{ 
            xtype: 'gridcolumn', 
            dataIndex: 'id', 
            text: 'Id' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'version', 
            text: 'Version' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'driverId', 
            text: 'DriverId' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'firstName', 
            text: 'FirstName' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'middleName', 
            text: 'MiddleName' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'lastName', 
            text: 'LastName' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'email', 
            text: 'Email' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'workPhone', 
            text: 'WorkPhone' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'note', 
            text: 'Note' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'licenseNumber', 
            text: 'LicenseNumber' 
           }, { 
            xtype: 'gridcolumn', 
            dataIndex: 'providerId', 
            text: 'ProviderId' 
           }] 
          }] 
         }] 
        }] 
       }] 
      }] 
     }); 

     me.callParent(arguments); 
    } 

}); 

回答

1

很难说什么,而不必小提琴或一些简单的样本,但看着你的代码,我发现一个有趣的事情:

你只在顶层有layout: border,然后你有很多嵌套里面的面板。尝试在包含正在折叠的两个面板的容器中定义border布局。