Extjs - change checkbox label

Question

i have a xtype "checkbox", i want change boxlabel by dynamic

{
    xtype:'checkbox',
    id: 'abc',
    checked: false,
    uncheckedValue: '0',
    inputValue: 1,
    boxLabel: 'change',
    name:'abc'
}

i using

Ext.getCmp('abc').setBoxLabel('not working'); // it's not working

or

Ext.getCmp('abc').update('loss checkbox'); // it's working but checkbox's disappear.

How can i do that? thanks

Answer 1

In Ext JS 4.2+ use setBoxLabel()

In Ext JS 4.1+ I've just found this workaround can help:

Ext.getCmp('abc').getEl().down('label.x-form-cb-label').update('New Label')

Answer 2

getBoxLabel should be working (see this jsFiddle).

Maybe what you want to use is fieldLabel and setFieldLabel?

Answer 3

A cleaner approach (IMO)

For ExtJs 4.1.1 (this was officially added in later versions of the framework)

I found the override recommended by Condor https://www.sencha.com/forum/showthread.php?71968-Set-Checkbox-boxLabel-dynamically to be the best option because this works even if the checkbox is not rendered which is not the case in DrakES solution.

Ext.override(Ext.form.Checkbox, {
    setBoxLabel: function(boxLabel){
        this.boxLabel = boxLabel;
        if(this.rendered){
            //NOTICE I CHANGED THIS LINE FROM THE ONE IN THE ORIGINAL SENCHA FORUM
            this.getEl().down('label.x-form-cb-label').update('New Label');
        }
    }
});

Now you can use .setBoxLabel() :)