[英]Tap event on textfield in Sencha Touch
我可以将tap事件添加到文本字段中,如下所示:
{
xtype : 'textfield',
name : 'GIVEN_NAME',
label : 'Given Name',
disabled: false,
listeners : {
element : 'element',
tap : function() {
console.log('tap');
}
}
}
而且有效。 但是,这在控制器中使用时不起作用:
control: {
givenName: {
element : 'element',
tap: 'onGivenNameTap'
}
}
为什么? 如何使点击事件在文本字段上起作用?
默认情况下,控制器无法监听元素事件: https : //www.sencha.com/forum/showthread.php?251844s&p=922908&viewfull=1#post922908
但是您可以将自己的自定义事件添加到TextField组件: https : //fiddle.sencha.com/#fiddle/rio
Ext.define('Fiddle.field.Text', {
override: 'Ext.field.Text',
initialize: function() {
this.callParent();
this.on('painted', function() {
var cmp = this;
cmp.element.on('tap', function() {
cmp.fireEvent('elementtap', cmp, cmp.element);
});
});
}
});
Ext.define('Fiddle.controller.Main', {
extend: 'Ext.app.Controller',
config: {
refs: {
givenName: 'textfield[name="givenName"]'
},
control: {
givenName: {
elementtap: 'onGivenNameTap'
}
}
},
onGivenNameTap: function() {
Ext.Msg.alert('Tap!');
}
});
Ext.application({
name : 'Fiddle',
controllers: ['Fiddle.controller.Main'],
launch : function() {
Ext.create('Ext.Panel', {
fullscreen: true,
items: [{
xtype : 'textfield',
name : 'givenName',
label : 'Given Name',
disabled: false
}]
});
}
});
尝试这个:
您认为:
Ext.define('MyApp.view.my_view', {
extend: 'Ext.Panel',
config: {
layout: 'fit',
items: [
{
xtype: 'textfield',
itemId: 'my_text_field',
label: 'My Label',
listeners: [
{
element: 'element',
event: 'tap',
fn: function () {
this.fireEvent('tap', this);
}
}
]
}
]
}
});
在您的控制器中:
Ext.define('MyApp.controller.my_controller', {
extend: 'Ext.app.Controller',
requires: [
'MyApp.view.my_view'
],
config: {
control: {
'textfield[itemId=my_text_field]': {
tap: 'onMyTextFieldTap'
}
}
},
onMyTextFieldTap: function () {
alert('tap');
}
});
当文本字段被点击时,您正在从视图中手动触发tap
击事件,控制器正在监听它,并且在发生该事件时将执行onMyTextFieldTap
。
看起来您是具有ExtJs背景的? 在“触摸”中,您必须执行其他操作。
Ext.define('MyApp.Controller, {
extend: 'Ext.app.Controller',
config: {
refs: {
givenNameCt: 'textfield[name=GIVEN_NAME]'
},
control: {
givenNameCt: {
tap: 'onGivenNameTap'
}
}
}
...
onGivenNameTap: function(ct) {
console.log('onGivenNameTap happens...', arguments);
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.