2

追加ボタンをクリックするとテキストフィールドが動的に追加されます。その後、保存ボタンをクリックするときに動的に追加した値を取得する必要があります。その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());
                                    }
                                }]
                            });
4

2 に答える 2

3

ここで私がやろうとしているのは、フォームの各要素を照会する必要がある保存の onclick です。要素 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());
    }
}

ここで確認できるフィドラーを作成しました。

フィドル

注: ExtJs 2 のフィドル作業は見られないので、ExtJS 4 で行いました。上記の回答は、ExtJS 4 以降で機能します。ExtJS 2 のフィドルを作成していただければ、さらに試してみます。

于 2016-10-28T07:40:14.360 に答える
1

配列を作成するたびにそれらを配列に追加するだけで、後で保存ボタンハンドラーでそれらを取得できます。

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());
        }
    }
}]
于 2016-10-25T13:01:13.197 に答える