bootstrap-validator

使用bootstrap-validator挺多的,虽然自己写认证并不复杂,我一向喜欢现成的控件,原因是风格一致,不容易出错。

这个是接口文档:http://bv.doc.javake.cn/settings/

有时候需要自己写认证: 这里面涉及两个字段之间的联合认证。(由于这个联合验证是验证两个字段非一致,而callback函数则是针对某个字段验证的,所以某个字段改变会导致两个字段都进行验证。)

自定义一个触发条件onvalid,当两个字段之间任何一个改变,就会触发两个字段的验证。


$('#dropdownMenu1').on("onvalid");
$('#dropdownMenu2').on("onvalid");

$('#dropdownMenu1').onchange(function(){  
$('#dropdownMenu1').trigger("onvalid")
 
$('#dropdownMenu2').trigger("onvalid")

})

$('#dropdownMenu2').onchange(function(){  
$('#dropdownMenu1').trigger("onvalid")
  $('#dropdownMenu2').trigger("onvalid")
})

$('#form1').bootstrapValidator({
fields: {

endpointA_sub: {
selector: '#dropdownMenu1',
message: '',
trigger:'onvalid',
validators: {
callback: {
message: '请选择节点',
callback:function(value, validator){
if ($('#dropdownMenu2').attr('value')!="")
return ($('#dropdownMenu1').attr('value')!=$('#dropdownMenu2').attr('value') && value!=="")
else
return value!==""
}
}
}

},
endpointB_sub: {
selector: '#dropdownMenu2',
message: '',
trigger:'onvalid',
validators: {
callback: {
message: '请选择节点',
callback:function(value, validator){
if ($('#dropdownMenu1').attr('value')!="")
return ($('#dropdownMenu1').attr('value')!=$('#dropdownMenu2').attr('value') && value!=="")
else
return value!==""
}
}
}
},

    }
});
 
原文地址:https://www.cnblogs.com/yasmi/p/5477545.html