BootStrap 动态添加验证项和取消验证项的实现方法
bootstrap中的bootstrapValidator可以对前端的数据进行验证,但是有的时候我们需要动态的添加验证,这样需要我们动态的对bootstrapValidator的内容做修改。
传统的bootstrapValidator验证是
$('#MaintainEntryForm').bootstrapValidator({
message:'输入值无效!',
feedbackIcons:{
valid:'glyphiconglyphicon-ok',
invalid:'glyphiconglyphicon-remove',
validating:'glyphiconglyphicon-refresh'
},
fields:{
Specifications:{
validators:{
notEmpty:{message:'请输入规格!'}
}
},
ProductNameEN:{
validators:{
notEmpty:{message:'请输入英文名称!'}
}
},
ApplyUnit:{
validators:{
notEmpty:{message:'请输入申报单位!'},
stringLength:{
min:1,
max:3,
message:'申报单位最多输入3位!'
}
}
},
SuttleWeight:{
validators:{
notEmpty:{message:'请输入净重!'},
//regexp:{regexp:/^\d{0,8}\.{0,1}(\d{1,3})?$/,message:'净重只能输入大于等于0的整数或者3位小数!'},
callback:{
message:'净重只能输入大于0的整数或者3位小数!',
callback:function(value,validator,$field){
varreg=/^\d{0,8}\.{0,1}(\d{1,3})?$/;
returnparseFloat(value)>0&®.test(value);
}
}
}
}
}
}).on("success.form.bv",function(e){
if(EntryInfo.SaveType==1){
EntryInfo.SaveEntryInfo();
}
elseif(EntryInfo.SaveType==2){
EntryInfo.SaveAndSubmitAudit();
}
});
这样的验证在页面有交互的需求的时候不能够满足条件,所以我们需要动态的对验证条件进行修改,这里的做法是先把所有可能用到的条件先全部添加进去,在指定条件下去除筛选条件。
去除方式
$('#MaintainEntryForm').data('bootstrapValidator').validateField('ApplyUnit');
这样名称为ApplyUnit的验证凡是就不会起作用了
对于已经提示报错信息的要去除验证信息的可以使用以下方式
$('#MaintainEntryForm').data('bootstrapValidator')
.updateStatus('ApplyQty','NOT_VALIDATED',null)
.validateField('ApplyQty');
这样页面对应的ApplyQty字段后面验证信息就会消失不用重置整个bootstrapValidator就可以了
以上所述是小编给大家介绍的BootStrap动态添加验证项和取消验证项的实现方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!