如何將嵌套在表格中的網格的列標題分組爲ExtJs

Question

我有一個嵌套在表單面板內的網格面板。網格包含分組標題，但分組標題的子列未正確加載。任何想法我做錯了什麼？

form = Ext.create('Ext.form.Panel', { 
    id: 'form-' + index, 
    layout: 'column', 
    height: 300, 
    width: 500, 

    items: [{ 
     xtype: 'container', 
     anchor: '100%', 
     columnWidth: 0.5, 
     items: [{ 
      xtype: 'textfield', 
      fieldLabel: 'Field1', 
      name: 'Field1Value', 
      anchor: '96%', 
      readOnly: true 
     }, { 
      xtype: 'textfield', 
      fieldLabel: 'Field2', 
      name: 'Field2Value', 
      anchor: '96%', 
      readOnly: true 
     }] 
    }, { 
     xtype: 'gridpanel', 
     title: 'Grid', 
     columnWidth: 0.5, 
     store: store, 
     columnLines: true, 
     columns: [{ 
      xtype: 'gridcolumn', 
      text: 'Column1', 
      dataIndex: 'Column1Value' 
     }, { 
      //xtype: 'gridcolumn', 
      text: 'Column2', 
      Columns: [{ 
       xtype: 'gridcolumn', 
       text: 'Column2A', 
       dataIndex: 'Column2AValue' 
      }, { 
       xtype: 'gridcolumn', 
       text: 'Column2B', 
       dataIndex: 'Column2BValue' 
      }, { 
       xtype: 'gridcolumn', 
       text: 'Column2C', 
       dataIndex: 'Column2CValue' 
      }] 
     }, { 
      //xtype: 'gridcolumn', 
      text: 'Column3', 
      Columns: [{ 
       xtype: 'gridcolumn', 
       text: 'Column3A', 
       dataIndex: 'Column3AValue' 
      }, { 
       xtype: 'gridcolumn', 
       text: 'Column3B', 
       dataIndex: 'Column3BValue' 
      }, { 
       xtype: 'gridcolumn', 
       text: 'Column3C', 
       dataIndex: 'Column3CValue' 
      }] 
     }, { 
      xtype: 'gridcolumn', 
      text: 'Column4', 
      dataIndex: 'Column4Value' 
     }, { 
      xtype: 'gridcolumn', 
      text: 'Column5', 
      dataIndex: 'Column5Value' 
     }, { 
      xtype: 'gridcolumn', 
      text: 'Column6', 
      dataIndex: 'Column6Value' 
     }] 
    }] 
}); 
var formpanel = Ext.getCmp('form-' + index); 
formpanel.loadRecord(record); 
return form; 

我注意到第一級列的值顯示正確，但分組的標題列沒有顯示任何值。它不顯示分組標題，只是第一級標題'Column2'和'Column3'。

謝謝

Answer 1

你做了一個小小的mistyping;你使用駱駝寫作爲Columns，所以它被忽略。寫

text: 'Column3', 
columns: [{ // <- this way it will work