BootStrap 动态添加验证项和取消验证项的实现方法

BootStrap 动态添加验证项和取消验证项的实现方法

bootstrap 中的bootstrapValidator可以对前端的数据进行验证，但是有的时候我们需要动态的添加验证，这样需要我们动态的对bootstrapValidator的内容做修改。

传统的bootstrapValidator验证是

$('#MaintainEntryForm').bootstrapValidator({

message: '输入值无效！',

feedbackIcons: {

valid: 'glyphicon glyphicon-ok',

invalid: 'glyphicon glyphicon-remove',

validating: 'glyphicon glyphicon-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) {

var reg = /^\d{0,8}\.{0,1}(\d{1,3})?$/;

return parseFloat(value) > 0 && reg.test(value);

}

}

}

}

}

}).on("success.form.bv", function (e) {

if (EntryInfo.SaveType == 1) {

EntryInfo.SaveEntryInfo();

}

else if (EntryInfo.SaveType == 2) {

EntryInfo.SaveAndSubmitAudit();

}

});

这样的验证在页面有交互的需求的时候不能够满足条件，所以我们需要动态的对验证条件进行修改，这里的做法是先把所有可能用到的条件先全部添加进去，在指定条件下去除筛选条件。

去除方式

$('#MaintainEntryForm').data('bootstrapValidator').validateField('ApplyUnit');

这样 名称为ApplyUnit的验证凡是就不会起作用了

对于已经提示报错信息的要去除验证信息的可以使用以下方式

$('#MaintainEntryForm').data('bootstrapValidator')

.updateStatus('ApplyQty', 'NOT_VALIDATED', null)

.validateField('ApplyQty');

这样页面对应的ApplyQty 字段后面验证信息就http://会消失 不用重置整个bootstrapValidator 就可以了

以上所述是给大家介绍的BootStrap 动态添加验证项和取消验证项的实现方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，会及时回复大家的。在此也非常感谢大家对我们网站的支持！

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。