问题: 使用bootstrapValidator验证时, 页面异步添加数据后清空form表单内容, 再次弹出添加数据Modal时字段无值, 但是之前的验证结果仍然存在, 造成二次添加时不能很好的对字段进行验证, 界面如下:
解决办法: 在数据添加成功后清空form表单内容, 销毁bootstrapValidator验证,重新初始化验证规则
1. 重置表单数据
$("#add_form")[0].reset(); // 异步请求添加, 页面不进行跳转才可以这样使用
2. 销毁验证规则
$("#add_form").data('bootstrapValidator').destroy();
$("#add_form").data('bootstrapValidator',null);
3. 初始化验证规则
var onValidatorInit = new validatorInit();
// 验证规则函数
varvalidatorInit = function() {
$("form").bootstrapValidator({
message:'字段输入有误',
feedbackIcons: {
valid:'glyphicon glyphicon-ok',
invalid:'glyphicon glyphicon-remove',
validating:'glyphicon glyphicon-refresh'
},
trigger: 'inputfocus', // 字段验证触发规则
fields: {
name: {
validators:{
notEmpty: {
message: '姓名不能为空'
}
}
},
birthday: {
validators:{
notEmpty: {
message: '生日不能为空'
}
}
},
gender: {
validators: {
notEmpty: {
message:'性别不能为空'
}
}
}
}
});
}
注意: 页面加载的时候记得初始化验证规则: $(function() {var onValidatorInit = new validatorInit();});