Ext JS 4 radio group check event

ext4, extjs, radio-button, radio-group

Solution

You have to handle 'change' event on every radio button. When a radio button changes (selected) then enable/disable the textfield.

Following an example:

Ext.create ('Ext.container.Container', {
    renderTo: Ext.getBody () ,
    items: [{
        xtype: 'textfield' ,
        id: 'tf' ,
        disabled: true ,
        fieldLabel: 'My Text'
    } , {
        xtype: 'radiogroup',
        fieldLabel: 'Enable / Disable ',
        columns: 2,
        vertical: true,
        items: [{
            boxLabel: 'Enable',
            name: 'formtype' , 
            inputValue: '1' ,
            listeners: {
                change: function (cb, nv, ov) {
                    if (nv) Ext.getCmp('tf').enable ();
                }
            }
        } , {
            boxLabel: 'Disable', 
            name: 'formtype', 
            inputValue:'2',
            checked: true ,
            listeners: {
                change: function (cb, nv, ov) {
                    if (nv) Ext.getCmp('tf').disable ();
                }
            }
        }]
    }]
});

Ciao

Problem

I am creating a radioGroup in extJS 4 using xtype inside a FormPanel. I am trying to enable/disable a textfield as soon as the radio is checked. ``` { xtype: 'radiogroup', fieldLabel: 'Enable / Disable ', columns: 2, vertical: true, items: [ {boxLabel: 'Enable', name: 'formtype', inputValue: '1'}, {boxLabel: 'Disable', name: 'formtype', inputValue:'2',checked:true}, ] } ``` I am confused where to add the listeners for check/click event. Thanks a ton in advance.

Original source