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.
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