javascript - Extjs 获取从按钮单击动态创建的 `formpanel`

Question

我有 ExtJS View-Port panel，它包含 center 面板，它包含 tablpanel，我在其中添加了 gridpanel 在一个选项卡中，在此我将 Add Person 按钮放在 的 tbar 中，这将在其 Reset 按钮中添加 formpanel 的新选项卡，我我无法访问表单来重置它。

有没有人遇到过同样的问题？

请帮助如何让它工作。

Ext.onReady(function() {
    // Ext.get(document.body, true).toggleClass('xtheme-gray');
    var myBorderPanel = new Ext.Viewport({
        title: 'Software Releases',
        // renderTo: document.body,
        renderTo: Ext.getBody(),
        layout: 'border',

        id: 'main',

        items: [{
            title: 'Center Region',
            region: 'center', // center region is required, no width/height specified

            tbar: [{
                text: 'Add person', // only when user have write priovilege.
                handler: function() {
                    var tabpanel = Ext.getCmp('main').findById('tabs');

                    var wtab = tabpanel.add({
                        //     // var addrelease_win = new Ext.Window({
                        url: 'reledit-submit.json',
                        id: 'addform0',
                        // height: 300, width: 400,
                        layout: 'form',
                        frame: true,
                        title: 'Add New Release',
                        closable: true,

                        items: [{
                            xtype: 'textfield',
                            fieldLabel: 'Name'
                        }],


                        buttons: [{
                            text: 'Save',
                            scope: wtab,
                            handler: function() {
                                wtab.getForm().submit({
                                    success: function(f, a) {
                                        Ext.Msg.alert('Success', 'It worked');
                                    },
                                    failure: function(f, a) {
                                        Ext.msg.alert('Warnning', 'Error');
                                    }
                                });
                            }
                        }, {
                            text: 'Reset',
                            scope: wtab,
                            handler: function() {
                                // Ext.getCmp('addform0').getForm().reset();
                                // tabpanel.getActiveTab.reset();
                                // Ext.getCmp('main').findById('addform').getForm().reset();
                                // this.getForm().reset();
                                // this.getForm().reset();
                                // Ext.Msg.alert('sdfsd', 'asdfsd ' + Ext.getCmp('addform0').getValue() + ' sdfsd');
                                this.findById('addform0').getForm().reset();
                                // Ext.Msg.alert('sdfsd', 'asdfsd ');
                            }
                        }]
                    });
                    // addrelease_win.show();

                    tabpanel.activate(tabpanel.items.length - 1);
                }
            }],
            xtype: 'tabpanel',

            id: 'tabs',

            activeTab: 0,

            items: [{
                title: 'Data',
                xtype: 'editorgrid',
                store: store,
                stripeRows: true,
                // autoExpandColumn: 'title',
                columns: [{
                    header: "Name",
                    dataIndex: "name",
                    width: 50,
                    sortable: true
                }, {
                    header: "DOB",
                    dataIndex: "dob",
                    sortable: true
                }]
            }],
            margins: '5 5 0 0',
        })
    })
});

Answer 1

wtab.getForm().reset(); 不起作用吗？

如果没有，请使用 this.ownerCt 到达按钮容器，然后沿着链向上走，直到到达可以访问表单的位置。

更新

真正的问题是它是一个带有表单布局的面板，而不是一个 FormsPanel。

将 layout:'form' 更改为 xtype:'form' 并且 .getForm() 应该可以工作。