需求:
在校验某个字段参数时,根据当前字段选的值 进而判断其他几个字段需要必填校验。
比如:
是否有子女: 1:是 2:否
子女姓名:
子女年龄:
我们需要根据是否有子女 这个字段来判断。子女姓名和子女年龄是否必填。如果有子女,那么其余字段必填,如果没有子女,那么其他两个字段不进行校验。
$("#FormId").bootstrapValidator({
message: '此值验证失败',
feedbackIcons: {
valid: 'fa fa-check',
invalid: 'fa fa-times',
validating: 'fa fa-refresh'
},
fields: {
collect_cause:{
message:'[采集事由]验证失败',
validators:{
notEmpty:{
message: '[采集事由]为必填'
},
}
},
is_children:{
message:'[是否为学龄儿童]验证失败',
validators:{
notEmpty:{
message: '[是否为学龄儿童]为必填'
},
callback: {
callback: function(value, validator) {
if (value === '1'){
//这里通过【是否学龄儿童】的值判断【是否就学】是否开启校验
validator.enableFieldValidators('is_student', true);
validator.validateField('is_student');
//这里通过【是否学龄儿童】的值判断【学校名称与班级】是否开启校验
validator.enableFieldValidators('school', true);
validator.validateField('school');
return true;
}
//关闭【是否就学】字段校验
validator.enableFieldValidators('is_student', false);
validator.enableFieldValidators('school', false);
return true;
}
}
}
},
is_student:{
message:'[是否就学]验证失败',
validators:{
notEmpty:{
message: '[是否就学]为必填'
},
}
},
school:{
message:'[学校名称与班级]验证失败',
validators:{
notEmpty:{
message: '[学校名称与班级]为必填'
},
}
},
is_medicare:{
message:'[是否有医社保]验证失败',
validators:{
notEmpty:{
message: '[是否有医社保]为必填'
},
callback: {
callback: function(value, validator) {
if (value === '1'){
validator.enableFieldValidators('medicare_space', true);
validator.validateField('medicare_space');
validator.enableFieldValidators('medicare_type', true);
validator.validateField('medicare_type');
return true;
}
validator.enableFieldValidators('medicare_space', false);
validator.enableFieldValidators('medicare_type', false);
return true;
}
}
}
},
medicare_space:{
message:'[医社保所在地]验证失败',
validators:{
notEmpty:{
message: '[医社保所在地]为必填'
},
}
},
medicare_type:{
message:'[社保类型]验证失败',
validators:{
notEmpty:{
message: '[社保类型]为必填'
},
}
},
}
}).on('success.form.bv', function(e, data) {
//表单校验成功toDo
}).on('error.form.bv', function(e, data) {
//表单校验失败toDo
//把按钮置灰
if (data != undefined ){
if (data.bv.getSubmitButton()) {
//data.bv.disableSubmitButtons(true);
}
}
});