Question

假设我有多个包含表单字段的嵌套面板（普通面板，不是form.Panel）。用户可以将这样的面板及其字段复制到不同的面板。

我不知何故需要将这些新创建的字段添加到主要的formpanel，以便提交，但不知道如何。

我无法做到

formpanel.add(fields)

因为那时他们被渲染到formpanel的身体而不是他们所在的面板。设置字段的renderTo属性也无济于事。

所以基本上我需要一种方法来向普通面板（或任何其他组件）添加字段，还要将其添加到特定的formpanel，以便在表单提交时提交其值。

有没有人这样做过，或者至少可以指出我正确的方向？

Answer 1

您可以将所有面板包装在一个表单面板中，并且将提交其中的所有字段。我这样做了，手风琴，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);
    }
});

不提交嵌套面板中的ExtJs 4动态表单字段

1 个答案: