Question

我在单击添加按钮时动态添加文本字段，之后我需要获取我在单击保存按钮时动态添加的值。它在extjs2.0本身。

这是我正在处理

的代码

var settingsEmailPanel = new Ext.FormPanel({
                                labelWidth: 75, // label settings here cascade unless overridden
                                url:'save-form.php',
                                frame:true,
                                id:'emailForm',
                                title: 'Email Servers',
                                bodyStyle:'padding:5px 5px 0',
                                width: 350,
                                defaults: {width: 230},
                                defaultType: 'checkbox',

                                items: [{
                                        boxLabel: 'Server 1',
                                        hideLabel: true,
                                        name: 'server1'
                                    },{
                                        boxLabel: 'Server 2',
                                        hideLabel: true,
                                        name: 'server2'
                                    },{
                                        boxLabel: 'Server 3',
                                        hideLabel: true,
                                        name: 'server3'
                                    }, {
                                        boxLabel: 'Server 4',
                                        hideLabel: true,
                                        name: 'server4'
                                    }
                                ],

                                buttons: [{
                                    text: 'Add',
                                    handler: function () {
                                    settingsEmailPanel.add({
                                            xtype: 'textfield',
                                            fieldLabel: 'New ServerName',
                                            name: 'newServer',
                                            allowBlank:false
                                        });
                                    settingsEmailPanel.doLayout();
                                    }
                                },{
                                    text: 'Save',
                                    handler: function () {
                                        alert("Save clicked");
                                        console.log(Ext.getCmp("emailForm").getForm().findField("newServer").getValue());
                                    }
                                }]
                            });

Answer 1

这里我要做的就是点击保存我需要查询表单的每个元素，如果元素xtype是textfield，那么每个都获取值并显示它。

保存按钮代码为：

{
    text: 'Save',
    handler: function() {
        var settingsEmailPanel = this.up().up();
        var settingsEmailPanelItem = settingsEmailPanel.items.items;
        for (var i = 0; i < settingsEmailPanelItem.length; i++) {
            if (settingsEmailPanelItem[i].xtype == "textfield") {
                var Value = settingsEmailPanelItem[i].getValue();
                alert(Value)
            }
        }
        // alert("Save clicked");
        //console.log(Ext.getCmp("emailForm").getForm().findField("newServer").getValue());
    }
}

我为你创建了一个小提琴手，你可以在这里查看。

Fiddle

注意：我看不到ExtJs 2的小提琴工作，所以我在ExtJS 4中工作。为了在extJS 2中工作，你需要为每个文本字段分配uniqe id，然后检索我想的值。以上答案适用于ExtJS 4及以上版本。如果你为ExtJS 2做了一个小提琴，我会再尝试一下。

Answer 2

每次创建一个数组时，只需将它们添加到数组中，以便稍后在保存按钮处理程序中检索它们：

var textFields = [];    
/*
 *  [...]
 */
buttons: [{
    text: 'Add',
    handler: function () {
        var textField = Ext.create('Ext.form.field.Text', {
            xtype: 'textfield',
            // ...
        });
        textFields.push(textFields);
        settingsEmailPanel.add(textField);
        settingsEmailPanel.doLayout();
    }
},{
    text: 'Save',
    handler: function () {
        for(var i=0; i<textFields.length; i++){
            console.log(textFields[i].getValue());
        }
    }
}]

如何在extjs2中获取具有相同名称的多个文本字段的值

2 个答案: