处理 Sencha Touch 中单选按钮上的事件
我正在尝试添加一些代码,每当用户单击 Sencha touch 面板中的单选按钮选项之一时,就会调用这些代码。我通过向面板主体添加一个点击侦听器并仅检查目标并确保它是一个单选按钮(具有值)来使其工作。
我确信有更好的方法来绑定这个处理程序。我看过一些关于听众的教程,据我了解“我做错了”。但我在哪里可以找到有关正确做法的信息呢?这是我正在做的事情的精简版本,它使用 Sencha Touch 1.1.0(这是应用程序 javascript 文件)工作:
Ext.setup({
onReady: function() {
panel = new Ext.Panel({
fullscreen: true,
title: 'Test',
scroll: 'vertical',
items: [{
xtype: 'fieldset',
defaults: {
xtype: 'radiofield',
labelWidth: '80%',
name: 'opt',
},
items: [{label: 'first', value: 1}, {label: 'second', value: 2}]
}],
});
panel.addListener({
body: {
click: function(ctl) {
if (ctl && ctl.target && ctl.target.value) {
console.log('checked control ' + ctl.target.value);
}
}
}
});
}
});
我假设我应该做的是绑定到字段集而不是正文,并且可能监听更改事件而不是单击事件。但除了这个之外,我尝试过的所有形式似乎都不起作用。
I'm trying to add a bit of code that gets called whenever the user clicks on one of the radio button options in a panel in Sencha touch. I have it working by adding a click listener to the body of the panel and just checking the target and making sure it's a radio button (has a value).
I'm sure there's a better way to bind this handler. I've watched some of the tutorials about listeners, and from what I understand "I'm doing it wrong". But where can I find the info about doing it right? Here's a stripped down version of what I'm doing, which works using Sencha Touch 1.1.0 (this is the app javascript file):
Ext.setup({
onReady: function() {
panel = new Ext.Panel({
fullscreen: true,
title: 'Test',
scroll: 'vertical',
items: [{
xtype: 'fieldset',
defaults: {
xtype: 'radiofield',
labelWidth: '80%',
name: 'opt',
},
items: [{label: 'first', value: 1}, {label: 'second', value: 2}]
}],
});
panel.addListener({
body: {
click: function(ctl) {
if (ctl && ctl.target && ctl.target.value) {
console.log('checked control ' + ctl.target.value);
}
}
}
});
}
});
I'm assuming what I should be doing is binding to the fieldset instead of the body, and probably listening for a change event instead of a click event. But all the forms I've tried besides this one don't seem to work.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
我已经制定了一个如下所示的版本:
我怀疑有一种方法可以将其附加到 fieldset 元素而不是面板,但这比我的替代方案要好得多。我不再需要检查传递到单击事件处理程序的目标项来查看它是否是单选按钮,委托设置会处理这一点。现在,当我动态地将项目添加到字段集中时,处理程序可以正常工作。
I've worked down a version that looks like this:
I suspect there's a way to attach that to the fieldset element instead of the panel, but this is a lot better than the alternatives I had. I no longer have to inspect the target item passed into the click event handler to see if it was a radio button, the delegate setting takes care of that. And now the handler works appropriately when I dynamically add items to the fieldset.
您可以尝试将侦听器添加到无线电场项目,或者像您所说的那样,添加到字段集。这应该适用于无线电场项目:
You can try adding listeners to your radiofield items, or like you said, to the fieldset instead. This should work for radiofield items:
您可以将侦听器添加到原始脚本的默认部分,如下所示:
You can add the listener(s) to the default section of the original script, like so: