ExtJS 4 RadioGroup Change Event两次爆发
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ExtJS 4 RadioGroup Change Event两次爆发相关的知识,希望对你有一定的参考价值。
我正在使用ExtJS 4.0.7,我是Ext的新手,并且正在使用新的MVC架构。我有一个RadioGroup,改变后,我想用来揭示更多的UI元素。问题是,更改事件会为RadioGroup触发两次。我假设这是因为两个无线电都会激活事件以使其值发生变化。
是否有办法侦听对具有相同名称的RadioGroup或Radios的更改只会触发一次?根据我对jQuery和Flex的经验,我希望RadioGroup只能触发一次。
这是我视图中的RadioGroup代码:
items: [{
xtype: 'radiogroup',
id: 'WheatChoice',
padding: '',
layout: {
padding: '-3 0 4 0',
type: 'hbox'
},
fieldLabel: 'Choose Model',
labelPad: 5,
labelWidth: 80,
allowBlank: false,
columns: 1,
flex: 1,
anchor: '60%',
items: [
{ xtype: 'radiofield', id: 'SpringWheat', padding: '2 10 0 0', fieldLabel: '',
boxLabel: 'Spring', name: 'wheat-selection', inputValue: '0', flex: 1 },
{ xtype: 'radiofield', id: 'WinterWheat', padding: '2 0 0 0', fieldLabel: '',
boxLabel: 'Winter', name: 'wheat-selection', inputValue: '1', checked: true, flex: 1 }
]
}]
这是我的控制器中的相关代码:
init: function() {
this.control({
'#WheatChoice': {
change: this.onWheatChange
}
});
},
onWheatChange: function(field, newVal, oldVal) {
//this fires twice
console.log('wheat change');
}
http://www.sencha.com/forum/showthread.php?132176-radiogroup-change-event-fired-twice/page2
evant说这将用4.1修复,所以它肯定是一个bug。
但是,您可以非常轻松地处理这种情况:
//borrowing your function
onWheatChange: function(rg, sel) {
var selection = sel['wheat-selection'];
if (!(selection instanceof Object)) {
alert(selection);
}
}
var selection将是新值。我知道它不能解决两个事件发射问题,但希望这有帮助!
它发射两次的原因是因为你的无线电组发生了两次变化。
一个单选按钮正在从checked=true
变为checked=false
,然后你新点击的单选按钮从checked=false
变为checked=true
。这应该是一个预期的事情。
如果您不想再检查单选按钮时想要做什么怎么办?你会错过整个活动。真的,你应该只检查你的监听器功能,只听取有checked=true
的单选按钮。
它可能会被触发,因为正在设置初始值并触发事件。尝试添加第三个无线电元素,看它是否会发射三次。
试试这个:
change : function(thisFormField, newValue, oldValue, eOpts) {
if (!Ext.isArray(newValue.myTransitionsRadio)) {
// Code goes here.
}
在我的情况下,myTransitionsRadio是所有单选按钮的通用名称。
谢谢Nagendra
以上是关于ExtJS 4 RadioGroup Change Event两次爆发的主要内容,如果未能解决你的问题,请参考以下文章
如何使用 extjs 4.2 更改 radiogroup 检查值的样式?
extjs radioGroup怎么取选中的值?怎么设置值选中
ExtJs radiogroup form.loadRecord方法无法赋值正确解决办法
EXTJS 里怎么给一个formpanel 加一个监听器(addlistener)监听 form里所有的textfiled的change事件