如何将change事件添加到窗口内表单的所有"文本字段"?首先,我创建了一个带有窗体的窗口。所有字段都用值0初始化。我想检测用户输入(可能使用dirtychange),如果大于1,则更改textField的背景色。
这是我目前的代码:
Ext.define('WPT.view.HoursPerMonthWindow', {
extend: 'Ext.window.Window',
alias : 'widget.hourspermonthwindow',
title : 'Hours per Months',
layout: 'fit',
autoShow: true,
initComponent: function() {
this.items = [
{
xtype: 'form',
items: [
{
xtype: 'textfield',
name : 'january',
itemId: 'january',
fieldLabel: 'January'
},
{
xtype: 'textfield',
name : 'february',
itemId: 'february',
fieldLabel: 'February'
}
,
{
xtype: 'textfield',
name : 'march',
itemId: 'march',
fieldLabel: 'March'
},
{
xtype: 'textfield',
name : 'april',
itemId: 'april',
fieldLabel: 'April'
},
{
xtype: 'textfield',
name : 'may',
itemId: 'may',
fieldLabel: 'May'
},
{
xtype: 'textfield',
name : 'june',
itemId: 'june',
fieldLabel: 'June'
},
{
xtype: 'textfield',
name : 'july',
itemId: 'july',
fieldLabel: 'July'
},
{
xtype: 'textfield',
name : 'august',
itemId: 'august',
fieldLabel: 'August'
},
{
xtype: 'textfield',
name : 'september',
itemId: 'september',
fieldLabel: 'September'
},
{
xtype: 'textfield',
name : 'october',
itemId: 'october',
fieldLabel: 'October'
},
{
xtype: 'textfield',
name : 'november',
itemId: 'november',
fieldLabel: 'November'
},
{
xtype: 'textfield',
name : 'december',
itemId: 'december',
fieldLabel: 'December'
}
]
}
];
this.buttons = [
{
text: 'Save',
action: 'save'
},
{
text: 'Cancel',
scope: this,
handler: this.close
}
];
this.callParent(arguments);
}
})
你对这个问题有什么建议吗?谢谢你的帮助Manel
Extjs提供了一种非常简单的添加监听器的方法,尤其是extjs4mvc架构。您应该将侦听器添加到视图的控制器中
Ext.define('App.controller.SomeController', {
extend:'Ext.app.Controller',
init:function () {
this.control({
'hourspermonthwindow > form > textfield':{
change: this.handleOnChange
}
});
},
handleOnChange:function(textfield,newValue,oldValue){
//your code here
}
});
定义一个扩展textfield
的新组件,并在其中添加侦听器,然后在表单中使用它。
只要一个简单的change
监听器就可以了。
然后添加一个带有颜色的css类,或者如果每行需要不同的颜色,则通过代码进行设置,并使用传递给新组件的自定义color
var
代替{xtype : 'textfield' ... }
字段我有新的Ext.form.TextField,我尝试了这个,并完美地工作
new Ext.form.TextField({enableKeyEvents: true ,
listeners : {
change : function (f, e){
action_form_update_brdoutput(null, frmBRDOutput.getForm().getValues());
}
}
})
Extjs为您提供了监听器,因此您可能会使它们过载。