jquery-easyui的validate控件可用于控件校验。我们常使用它的required:true属性来说明这个控件是必填的。该控件的最大好处是可扩展校验方法。
下面以一个双重校验为例说明使用方法:
html代码:
<input class="validatebox" id="dataEn" type="text" name="dto.businessData.bdNameEn" maxlength="100"
data-options="validType:['checkEn','addReapet[dataCodeId,dataEn]'],required:true"/>
<input class="text" id="dataCodeId" type="hidden" name="dto.businessData.bfCodeId"/>
validType:属性用于指明校验方法,其值为:方法名[参数1,参数2,...],或者由方法组成的数组。
这里checkEn校验方法没有参数,addRepeat方法传入了2个id名称。
js扩展:
$(function(){
$.extend($.fn.validatebox.defaults.rules, {
checkEn:{
validator: function(value,param){
return /^[A-Za-z0-9]+$/.test(value);
},
message: '只能输入字母或者数字'
},
addReapet:{
validator: function(value,param){
var bfCodeId = $("#"+param[0].id).val();
var bdNameEn = $("#"+param[1].id).val();
return checkNameEn(bfCodeId,bdNameEn);
},
message:'该字段名已经存在!'
}
});
});
function checkNameEn(bfCodeId,bdNameEn){
var flag = true;
$.ajax({
type:'post',
url:$WEB_ROOT_PATH+'/middleTable/middleTableCtrl.htm?BLHMI=checkDataNameEn',
data:{'dto.businessData.bfCodeId':bfCodeId,'dto.businessData.bdNameEn':bdNameEn},
dataType:'json',
async:false,
success:function(msg){
if(msg == "1"){
flag=false;
}
}
});
return flag;
}
上面的validator为初始化,function中的value是当前控件的值。
param是传入的校验参数,是一个数组。当传入的参数未带引号的时候,$("#"+param[0])是一个DOM对象。当参数带有引号,那么$("#"+param[0])是一个jQuery对象。
return返回的是true或false。当为true时控件的validate方法值为true通过校验,当为false时控件的validate方法值为false,校验不通过,会在控件后显示message中的提示信息。