ExtJS 2.3。 0 无线电点击事件触发两次答案

【问题标题】：ExtJS 2.3. 0 radio click event is firing twiceExtJS 2.3。 0 无线电点击事件触发两次
【发布时间】：2014-01-23 19:15:50
【问题描述】：

我正在使用Extjs 2.3.0

我有一个单选按钮，根据我的要求，我想添加一个可以取消选中单选按钮的功能。（通常我们不会取消选中收音机）我解决了它如下

 { boxLabel: 'Yes', name: 'Yes', inputValue: 'Yes', xtype: 'radio',
   onClick: function (e) {
         if (this.checked) {                                        
              this.setValue(false);
         } else {
              this.setValue(true);
         }
   }
 }

一切正常

现在，我的问题是，如果我点击单选按钮，上面的代码可以正常工作，但如果我点击 单选按钮标签，点击事件会触发两次。那就是框标签“是”。

由于事件触发了两次并且收音机无法检查。

我不明白为什么事件在标签点击时触发两次，而不是在无线电点击时触发。任何人都可以有任何解决方案或解决方法吗？

【问题讨论】：

有什么用？单选按钮不是复选框。如果您需要一个具有两种状态的组件 - 使用复选框
我不能使用复选框。我必须使用带有取消选中选项的单选框。

标签： extjs onclick radio

【解决方案1】：

嗯，无法选中的单选框，听起来很奇怪 :)

无论如何，您在配置中覆盖了收音机的 onClick 方法（继承自 Ext.form.CheckBox），如下所示：

// private
onClick : function(e){
    if (!this.disabled && !this.readOnly) {
        this.toggleValue();
    }
    e.stopEvent();
},

因此，您需要像在原始函数中那样停止事件传播。另外，我建议也使用 toggleValue 函数，因为这样可以确保正确取消选中名称为 name 的其他无线电：

onClick: function(e) {
    if (!this.disabled && !this.readOnly) {
        if (!this.checked) {
            this.toggleValue();
        } else {
            this.setValue(false);
        }
    }
    e.stopEvent();
},

顺便说一句，最好的方法可能是创建一个扩展 Ext.form.RadioBox 的新类。查看this fiddle。

【讨论】：