Ext JS 4 无线电组检查事件答案

【问题标题】：Ext JS 4 radio group check eventExt JS 4 无线电组检查事件
【发布时间】：2012-05-29 17:45:14
【问题描述】：

我正在使用 FormPanel 中的 xtype 在 extJS 4 中创建一个 radioGroup。我正在尝试在检查收音机后立即启用/禁用文本字段。

{
xtype: 'radiogroup',
fieldLabel: 'Enable / Disable ',
columns: 2,
vertical: true,
items: [
     {boxLabel: 'Enable', name: 'formtype', inputValue: '1'},
     {boxLabel: 'Disable', name: 'formtype', inputValue:'2',checked:true},
    ]
 }

我很困惑在哪里添加检查/单击事件的侦听器。提前致谢。

【问题讨论】：

我尝试添加这种方式，但为什么它显示 alert() 2 次？
监听器：{ "change" : function(field, newValue, oldValue, eOpts ){ alert(this.items); } }

标签： extjs radio-button radio-group ext4

【解决方案1】：

您必须处理每个单选按钮上的“更改”事件。当单选按钮更改（选中）时，启用/禁用文本字段。

举个例子：

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 ();
                }
            }
        }]
    }]
});

调

【讨论】：

【解决方案2】：

如果您在广播组本身（而不是在每个按钮上）设置监听器更改事件，您只需处理一个事件。您的侦听器/处理程序将被调用并传递newVal 和oldVal。然后，您可以获取 newVal 作为选择的值。

【讨论】：