ExtJS的嵌套板4個動態表單字段沒有提交

Question

比方說，我有一個包含表單域多重嵌套面板（純的，而不是form.Panel）。 用戶可以將此類面板及其字段複製到不同的面板。

不知何故，我需要將這些新創建的字段添加到主FormPanel中，使他們得到提交，但不知道怎麼辦。

我不能做

formpanel.add(fields) 

因爲當時他們正在渲染到FormPanel中的身體，而不是他們在首位的面板。設置字段的renderTo屬性也沒有幫助。

所以基本上我需要添加一個字段到正常的面板（或與此有關的任何其他成分）的一種方式，同時也將其添加到特定的FormPanel中那麼它的價值是在表單提交提交。

有沒有人這樣做或至少可以點我在正確的方向？

Answer 1

您可以將所有面板包裹在一個表單面板中，並提交所有內部字段。我採用這種方式，將accordeons，tabpanel和普通面板深深嵌套在一起。例如：

var form = Ext.create('Ext.form.Panel', { 
    // form attributes goes here... 
    // ... 
    initComponent: function(){ 
     // all your panels goes here. 
     this.items = [ 
      { 
       xtype:'panel', 
       title: 'First panel', 
       layout: 'anchor', 
       frame: true, 
       defaults: {anchor: '100%'}, 
       items: [ 
        {xtype:'textfield', name: 'foo',fieldLabel: 'Foo'}, 
        {xtype:'textfield', name: 'foo',fieldLabel: 'Bar'} 
       ] 
      }, 
      { 
       xtype:'panel', 
       title: 'Second panel', 
       layout: 'anchor', 
       frame: true, 
       defaults: {anchor: '100%'}, 
       items: [ 
        {xtype:'textfield', name: 'baz',fieldLabel: 'Baz'}, 
        { 
         xtype: 'panel', 
         items: [/* another set of fields */] 
        } 
       ] 
      }, 
     ]; 

     this.buttons = [/* ... your buttons here ...*/]; 

     this.callParent(arguments); 
    } 
});