How to get the value of checkbox

Question

How to get the value of a check box?

var tb = new Ext.Toolbar();

tb.add({
                xtype: 'checkbox',
                boxLabel: 'Expand Groups by Default',
                id: 'GetChkBoxValue',
                checked: true,
                handler: function() {
                    alert(this.getValue())
                }
       });

Is it possible to get the value of the checkbox outside tb.I have done something like this but it is not firing

Ext.getCmp('GetChkBoxValue').getValue();

What is happening? An error? The code you created should work. The only thing I can think of, is that you are trying to call getValue before the toolbar is rendered. Since your checkbox is created on demand (by passing in a cfg object), Ext.getCmp will not find the element until it has been rendered. — Ruan Mendes, Dec 21 '09 at 19:35
yes the problem is it always gives me false because the object is instantiated and is called before it is rendered.I wonder How can i get the value of a checkbox ?? — xrx215, Dec 21 '09 at 21:51
I can access the value of the checkbox in the grid panel as follows Ext.getCmp('chkid').getValue() Using this value if it is true i have to exapnd the groups and if it is false i have to collapse the groups. Can anyone help me in expanding and collapsing the groups in the grid panel. — xrx215, Dec 21 '09 at 23:39

score 3 · Answer 1 · answered Dec 30 '09 at 17:53

Try out the following code, it should work:

new Ext.Window({
    renderTo: Ext.getBody(),
    width: 500,
    height: 200,
    title: 'test window',
    items: [{
       xtype: 'checkbox',
       boxLabel: 'Expand Groups by Default',
       id: 'chkid',
       checked: true
    }]
}).show()
Ext.getCmp('chkid').getValue()

Then play with the checkbox and with getValue() you get its state (checked or not). Happy ExtJS coding!

score 2 · Accepted Answer · edited Aug 15 '11 at 13:15

Here is what worked for me:

var expandAllGroupsCheckbox = Ext.create(

            {
                xtype: 'checkbox',
                boxLabel: 'Expand Groups by Default',
                id: 'chkid',
                checked: true,
                afterRender: function() {
                    Ext.form.Checkbox.superclass.afterRender.call(this);
                    alert(this.getValue());// giving true 
                    this.checkChanged();
                },
                checkChanged: function()
                {
                    var checked = expandAllGroupsCheckbox.getValue();
                    gv.startCollapsed = !checked;
                    if ( gv.mainBody )
                    {
                        gv.toggleAllGroups( !checked );
                    }
                },
                listeners: {
                    check: {
                        fn: function(){expandAllGroupsCheckbox.checkChanged()}
                    }
                }

            });

And then:

tbar: [
               expandAllGroupsCheckbox
,
                    {
                        xtype: 'tbbutton',
                        icon: '/images/icon_list_props.gif',
                        handler: function() {
                            ShowPreferencesPage();
                        }
                    }
],

score 1 · Answer 3 · edited Aug 15 '11 at 13:14

1

Just this:

var cbox = Ext.getCmp('cboxId');
alert(cbox.checked);

edited Aug 15 '11 at 13:14

Jason Plank

2,336
5
31
40

answered Mar 18 '11 at 16:42

meh

11
1

How to get the value of checkbox

3 Answers3

Linked