0

sを含む ExtJS ウィンドウとcheckboxgroup、選択した値を取得するためのボタンがあります。

ここに画像の説明を入力

私はそれで2つのイセウスを持っています。これはコードです：

Ext.create('widget.window', 
    {
        title  : 'Select which scenario to run',
        draggable: true,
        modal: true,
        header : 
        {
            titlePosition : 2,
            titleAlign    : 'center'
        },
        closable    : true,
        closeAction : 'hide',
        width       : 400,
        height      : 350,
        x           : contentPanel.getX() + 50,
        y           : contentPanel.getY() + 50,
        layout: {
        type: 'hbox',
        align: 'stretch'
        },
        items: 
        [
            {
                xtype: 'panel',
                title: 'If success',
                itemId : 'success',
                autoScroll:true,
                flex: 1,
                items:
                [{
                    xtype: 'checkboxgroup',
                    columns: 1,
                    vertical:true,
                    items: 
                    [
                        { boxLabel: 'Item 1', name: 'rb', inputValue: '1' },
                        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
                        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
                        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
                        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
                        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
                        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
                        { boxLabel: 'Item 5', name: 'rb', inputValue: '5' },
                        { boxLabel: 'Item 6', name: 'rb', inputValue: '6' }
                    ]
                }]
            },
            {
                xtype: 'panel',
                title: 'If failure',
                id: 'failure',
                autoScroll:true,
                flex: 1,
                items:
                [{
                    xtype: 'checkboxgroup',
                    columns: 1,
                    vertical:true,
                    items: 
                    [
                        { boxLabel: 'Item 1', name: 'rb', inputValue: '1' },
                        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
                        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
                        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
                        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
                        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
                        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
                        { boxLabel: 'Item 5', name: 'rb', inputValue: '5' },
                        { boxLabel: 'Item 6', name: 'rb', inputValue: '6' }
                    ]
                }]
            }
        ],
        buttons:
        [{
            text    : 'Save',
            itemId  : 'if_save',
            icon    : '../images/save.png',
            ui      : 'default',
            handler : function()
            {
                var cb_f = Ext.getCmp('failure').getValue()
                alert(JSON.stringify(cb_f));
            }
        }]

    }).show();

ボタンハンドラーでは、チェックボックスから選択したアイテムを取得したいと考えています。、
を試しましたが、firebug はそれらが未定義であると言い続けています。this.getComponent('success').getValue()Ext.getCmp('failure').getValue()

では、「保存」をクリックして値を取得するにはどうすればよいですか?

ありがとう

4

4 に答える 4

3

たとえば、checkboxgroup の ID を作成すると、

xtype: 'checkboxgroup',
id: 'SUCCESS_CHECKBOX_ID',
columns: 1,
vertical:true,
items: 
[
  { boxLabel: 'Item 1', name: 'rb', inputValue: '1' },
  { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
  { boxLabel: 'Item 3', name: 'rb', inputValue: '3' }
]

次のことができます。

handler : function()
{
  var selectedSuccessValues = Ext.getCmp('SUCCESS_CHECKBOX_ID').getChecked();               
  for(var i=0;i<selectedSuccessValues.length;i++)
  {
    alert(selectedSuccessValues[i].inputValue);
  }             
}
于 2014-12-11T02:07:18.267 に答える
1

によると：選択したすべてのチェックボックスを配列 で取得する場合、次のようなものをお勧めします：

チェックボックスグループを ID で拡張します。

[{
    xtype: 'checkboxgroup',
    id: 'myGroup',
    columns: 1,
    vertical: true,
    items:
    [
        { boxLabel: 'Item 1', name: 'rb', inputValue: '1' },
        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
        { boxLabel: 'Item 2', name: 'rb', inputValue: '2' },
        { boxLabel: 'Item 3', name: 'rb', inputValue: '3' },
        { boxLabel: 'Item 4', name: 'rb', inputValue: '4' },
        { boxLabel: 'Item 5', name: 'rb', inputValue: '5' },
        { boxLabel: 'Item 6', name: 'rb', inputValue: '6' }
    ]
}]

後でセレクターを介して選択したアイテムを取得できるようにします。

buttons:
[{
    text: 'Save',
    itemId: 'if_save',
    icon: '../images/save.png',
    ui: 'default',
    handler: function () {
        var group = Ext.getCmp('myGroup');
        var checkedArray = group.query('[checked="true"]');

        var cb_f = Ext.getCmp('failure').getValue();
        alert(JSON.stringify(cb_f));
    }
}]

うまくいけば、この答えも役に立ちます！

于 2013-07-12T12:51:32.540 に答える