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!==""
}
}
}
},
}
});