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); 
    } 
});