Ext中如何校验TextField的字段被修改了?
场景描述:
在form表单中有个sfzhm的字段,需要去后台进行sfzhm是否重复的校验,一开始使用了blur的event来去后台进行校验,后来发现在焦点离开时,及时数据没有发生变化,也会造成后台访问,造成大量的资源浪费,如何解决这个问题呢?
从官方的API中,查询可能解决此问题的属性或者事件:
- chagne事件
- dirtychange事件
- blur+focus事件:focus的时候记录原始值,blur离开的时候进行比较。
经过分析后,发现:
- change方法有问题:每次输入一个字符都会触发此事件,抛弃。
- dirtychange:官方文档希望达到的目的是,一旦跟原始时不一致时isDirty的值变成true。网络上很多人也是在用这个事件来进行校验,但是如果使用此属性要注意:
1.默认loadRecord会改变isDirty的值,如果想保持不变,需要在form中添加属性:trackResetOnLoad:true,
2.在一个页面中,修改一次后,isDirty的值变成true,后续无论怎么修改都不会再触发。(这样会造成漏判)。
- focus+blur的方法,能解决我的问题,见代码:
controlle中定义两个属性:
rybhOldValue : '',
sfzhmOldValue : '',
定义监控事件:
'#personWindow #rybh' : { focus : this.handlerRybhFocus, blur : this.handlerRybh, // //dirtychange:this.handleRybhDirtyChange, // change:this.handleRybhChange, }, '#personWindow #sfzhm' : { focus : this.handlerIDCardFocus, blur : this.handlerIdCard },
事件方法:
handlerRybhFocus : function(textField) { this.rybhOldValue = textField.getValue(); }, // handleRybhDirtyChange : function(textField,isDirty){ // console.log("此时触发了dirtychange事件,此时idDirty的值为:"+isDirty); // }, // handleRybhChange:function(textField, newValue, oldValue){ // console.log("此时触发了change事件,newValue='"+newValue+"', // oldValue='"+oldValue+"'"); // }, handlerRybh : function(textField) { if (textField.getValue() != this.rybhOldValue) { } }
希望有所帮助。