BootStrap 動(dòng)態(tài)添加驗(yàn)證項(xiàng)和取消驗(yàn)證項(xiàng)的實(shí)現(xiàn)方法
bootstrap 中的bootstrapValidator可以對(duì)前端的數(shù)據(jù)進(jìn)行驗(yàn)證,但是有的時(shí)候我們需要?jiǎng)討B(tài)的添加驗(yàn)證,這樣需要我們動(dòng)態(tài)的對(duì)bootstrapValidator的內(nèi)容做修改。
傳統(tǒng)的bootstrapValidator驗(yàn)證是
$('#MaintainEntryForm').bootstrapValidator({ message: '輸入值無(wú)效!', feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: { Specifications: { validators: { notEmpty: { message: '請(qǐng)輸入規(guī)格!' } } }, ProductNameEN: { validators: { notEmpty: { message: '請(qǐng)輸入英文名稱!' } } }, ApplyUnit: { validators: { notEmpty: { message: '請(qǐng)輸入申報(bào)單位!' }, stringLength: { min: 1, max: 3, message: '申報(bào)單位最多輸入3位!' } } }, SuttleWeight: { validators: { notEmpty: { message: '請(qǐng)輸入凈重!' }, //regexp: { regexp: /^\d{0,8}\.{0,1}(\d{1,3})?$/, message: '凈重只能輸入大于等于0的整數(shù)或者3位小數(shù)!' }, callback: { message: '凈重只能輸入大于0的整數(shù)或者3位小數(shù)!', 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(); } });
這樣的驗(yàn)證在頁(yè)面有交互的需求的時(shí)候不能夠滿足條件,所以我們需要?jiǎng)討B(tài)的對(duì)驗(yàn)證條件進(jìn)行修改,這里的做法是先把所有可能用到的條件先全部添加進(jìn)去,在指定條件下去除篩選條件。
去除方式
$('#MaintainEntryForm').data('bootstrapValidator').validateField('ApplyUnit');
這樣 名稱為ApplyUnit的驗(yàn)證凡是就不會(huì)起作用了
對(duì)于已經(jīng)提示報(bào)錯(cuò)信息的要去除驗(yàn)證信息的可以使用以下方式
$('#MaintainEntryForm').data('bootstrapValidator') .updateStatus('ApplyQty', 'NOT_VALIDATED', null) .validateField('ApplyQty');
這樣頁(yè)面對(duì)應(yīng)的ApplyQty 字段后面驗(yàn)證信息就會(huì)消失 不用重置整個(gè)bootstrapValidator 就可以了
以上所述是小編給大家介紹的BootStrap 動(dòng)態(tài)添加驗(yàn)證項(xiàng)和取消驗(yàn)證項(xiàng)的實(shí)現(xiàn)方法,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
js子頁(yè)面獲取父頁(yè)面數(shù)據(jù)示例
這篇文章主要介紹了js子頁(yè)面如何獲取父頁(yè)面數(shù)據(jù),需要的朋友可以參考下2014-05-05JavaScript實(shí)現(xiàn)帶緩沖效果的隨屏滾動(dòng)漂浮廣告代碼
這篇文章主要介紹了JavaScript實(shí)現(xiàn)帶緩沖效果的隨屏滾動(dòng)漂浮廣告代碼,通過(guò)JavaScript結(jié)合時(shí)間函數(shù)動(dòng)態(tài)響應(yīng)頁(yè)面元素滾動(dòng)事件實(shí)現(xiàn)懸浮廣告的緩沖漂浮效果,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-11-11js事件驅(qū)動(dòng)機(jī)制 瀏覽器兼容處理方法
下面小編就為大家?guī)?lái)一篇js事件驅(qū)動(dòng)機(jī)制 瀏覽器兼容處理方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-07-07學(xué)習(xí)JavaScript設(shè)計(jì)模式之單例模式
這篇文章主要為大家介紹了JavaScript設(shè)計(jì)模式中的單例模式,對(duì)JavaScript設(shè)計(jì)模式感興趣的小伙伴們可以參考一下2016-01-01小程序兩種滾動(dòng)公告欄的實(shí)現(xiàn)方法
這篇文章主要介紹了小程序兩種滾動(dòng)公告欄的實(shí)現(xiàn)方法,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-09-09淺析script標(biāo)簽中的defer與async屬性
最近在網(wǎng)上看到一個(gè)前輩在寫(xiě)script標(biāo)簽的時(shí)候,居然同時(shí)寫(xiě)了async和defer屬性,想著這是什么意思呢?所以決定深入的了解下這其中的學(xué)問(wèn),以下這篇文章就是個(gè)人在學(xué)習(xí)了之后的一些總結(jié)分析,有需要的朋友們可以參考借鑒,下面來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2016-11-11js鼠標(biāo)坐標(biāo)獲取常用的三個(gè)方法
這篇文章主要給大家介紹了js鼠標(biāo)坐標(biāo)獲取常用的三個(gè)方法,在 JavaScript中當(dāng)事件發(fā)生時(shí)獲取鼠標(biāo)的位置是件很重要的事件,需要的朋友可以參考下2023-09-09