How to check all the checkboxes in checkbox group in extjs?

Anand Singh picture Anand Singh · Jun 27, 2013 · Viewed 11.8k times · Source

I have a checkbox group with somany checkboxes in it. I want to check all of them once when a button clicked. These checkboxes are created dynamically.

var json = result.responseText;
    var temp = JSON.parse(json);

    for(var i=0;i<Object.keys(temp[newValue]).length;i++){           
        menuArray.push({
            xtype: 'checkboxfield',
            boxLabel: (temp[newValue][i]).split("_").join(" "),
            name: temp[newValue][i],
            id:temp[newValue][i],
            inputValue: 'true',
            uncheckedValue: 'false',
            formBind: false
        });
    }

    checkboxGroup = new Ext.form.CheckboxGroup({
        xtype: 'checkboxgroup',
        fieldLabel: '',
        id:'moduleCheckboxGroup',
        columns: 1,
        items: menuArray
    });

    permissionPanel.removeAll();
    permissionPanel.add(checkboxGroup);

Thanks in advance!

Answer

Eldono picture Eldono · Sep 10, 2013

you can use "query" method to search childs with "isCheckbox".

Ext.create('Ext.form.CheckboxGroup', {
    renderTo: Ext.getBody(),
    id: 'mycheckboxgroup',
    columns: 1,
    items: [{
        xtype: 'checkboxfield',
        boxLabel: 'Test1',
        name: 'test1',
        inputValue: 'true',
        uncheckedValue: 'false',
        formBind: false
    }, {
        xtype: 'checkboxfield',
        boxLabel: 'Test2',
        name: 'test2',
        inputValue: 'true',
        uncheckedValue: 'false',
        formBind: false
    }, {
        xtype: 'checkboxfield',
        boxLabel: 'Test3',
        name: 'test3',
        inputValue: 'true',
        uncheckedValue: 'false',
        formBind: false
    }]
});

Ext.create('Ext.Button', {
    renderTo: Ext.getBody(),
    text: 'Check all',
    handler: function () {
        var checkboxes = Ext.getCmp('mycheckboxgroup').query('[isCheckbox]');
        Ext.Array.each(checkboxes, function (checkbox) {
            checkbox.setValue(1);
        });
    }
});

Jsfiddle example