Ext中表单验证问题
Ext中表单验证问题
Ext中自带表单,但是表单在复用过程中,即只隐藏,下次需要的时候,再次show出来。表单本身可以通过setValues、getValues来操作,但是由于前期写代码的时候,并不知道表单也有这两个方法,加之之前人的代码也是使用了viewModel来进行传递值,所以呢,前期的代码就使用了viewModel进行更改表单的值。这样做,其实有两个不好的地方,其一就是,需要增加绑定的代码,增加了代码,使代码看上去更复杂,不简洁;其二,表单通过viewModel来更改值,即getViewModel().setData() ,这个函数操作后,实际上有一定的延时。而且如何设置了空值,则会引起表单进行验证,有红色的框,看起来不够好看。所以呢,不太建议使用viewModel来与表单进行绑定。
下面的代码,是我预约项目中使用到的。如下:
方式一是有问题的,问题是:在添加模式跟编辑模式,使用了两种不同的方式进行传递值。结果就是,方式一,setViewModel之后,导致了前后绑定不正确的原因。
而方式二,好像就没有这个问题。
//添加医生窗口
me.addDoctorWin = Ext.create('ShineECallView.view.nursing.AddDoctorWin',{
//添加事件监听器
listeners:{
'show':function(c,o){
var rds = me.getSelectionModel().getSelection();
var form=c.down('form');
if(c.actionType!=1){//编辑
var data=Ext.clone(rds[0]['data']);
console.log(data);
console.log(Ext.encode(data));
// window.cmp=c;
//方式一:
c.getViewModel().setData(data);
//方法二:
// form.getForm().setValues(data);
}else{//添加
form.getForm().setValues({
"Doctor_ID":'0',
'Doctor_Name':'',
'Doctor_Title': '',
'Doctor_Image':'',
'Doctor_Sex': '1',
'Department':me.groupIdList[0],
});
}
},
'hide':function(c,o){
c.down('form').reset();
}
}
});