BootStrap 動態(tài)添加驗(yàn)證項(xiàng)和取消驗(yàn)證項(xiàng)的實(shí)現(xiàn)方法
更新時間：2022年05月20日 11:31:36 作者：Flying_Boy
這篇文章主要介紹了BootStrap 動態(tài)添加驗(yàn)證項(xiàng)和取消驗(yàn)證項(xiàng)的實(shí)現(xiàn)方法的相關(guān)資料,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
bootstrap 中的bootstrapValidator可以對前端的數(shù)據(jù)進(jìn)行驗(yàn)證，但是有的時候我們需要動態(tài)的添加驗(yàn)證，這樣需要我們動態(tài)的對bootstrapValidator的內(nèi)容做修改。
傳統(tǒng)的bootstrapValidator驗(yàn)證是
$('#MaintainEntryForm').bootstrapValidator({
message: '輸入值無效！',
feedbackIcons: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
Specifications: {
validators: {
notEmpty: { message: '請輸入規(guī)格！' }
}
},
ProductNameEN: {
validators: {
notEmpty: { message: '請輸入英文名稱！' }
}
},
ApplyUnit: {
validators: {
notEmpty: { message: '請輸入申報(bào)單位！' },
stringLength: {
min: 1,
max: 3,
message: '申報(bào)單位最多輸入3位！'
}
}
},
SuttleWeight: {
validators: {
notEmpty: { message: '請輸入凈重！' },
//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)證在頁面有交互的需求的時候不能夠滿足條件，所以我們需要動態(tài)的對驗(yàn)證條件進(jìn)行修改，這里的做法是先把所有可能用到的條件先全部添加進(jìn)去，在指定條件下去除篩選條件。
去除方式
$('#MaintainEntryForm').data('bootstrapValidator').validateField('ApplyUnit');這樣 名稱為ApplyUnit的驗(yàn)證凡是就不會起作用了
對于已經(jīng)提示報(bào)錯信息的要去除驗(yàn)證信息的可以使用以下方式
$('#MaintainEntryForm').data('bootstrapValidator')
.updateStatus('ApplyQty', 'NOT_VALIDATED', null)
.validateField('ApplyQty');這樣頁面對應(yīng)的ApplyQty 字段后面驗(yàn)證信息就會消失 不用重置整個bootstrapValidator 就可以了
以上所述是小編給大家介紹的BootStrap 動態(tài)添加驗(yàn)證項(xiàng)和取消驗(yàn)證項(xiàng)的實(shí)現(xiàn)方法，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)添加刪除表格操作，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
setTimeout函數(shù)是一個原生的javascript函數(shù)。setTimeout函數(shù)會在一個指定的延遲時間之后調(diào)用一個函數(shù)或執(zhí)行一段指定的代碼。它的應(yīng)用非常廣泛，例如我們希望用戶在瀏覽器某個頁面一段時間后彈出一個對話框，或者是鼠標(biāo)點(diǎn)擊某個元素后隔幾秒鐘在刪除這個元素。2017-02-02
JS判斷數(shù)組是否包含某元素實(shí)現(xiàn)方法匯總
這篇文章主要介紹了JS判斷數(shù)組是否包含某元素實(shí)現(xiàn)方法匯總,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-06-06
bootstrap-table+treegrid實(shí)現(xiàn)樹形表格
這篇文章主要為大家詳細(xì)介紹了bootstrap-table+treegrid實(shí)現(xiàn)樹形表格，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-07-07
這篇文章主要介紹了基于JS判斷iframe是否加載成功的方法【多種瀏覽器】的相關(guān)資料,需要的朋友可以參考下2016-05-05
這篇文章主要介紹了10種JavaScript最常見的錯誤(小結(jié))，查看了數(shù)千個項(xiàng)目后，發(fā)現(xiàn)了 10 個最常見的 JavaScript 錯誤。我們會告訴你什么原因?qū)е铝诉@些錯誤，以及如何防止這些錯誤發(fā)生2019-06-06
基于javascript的COOkie的操作實(shí)現(xiàn)只能點(diǎn)一次
這篇文章主要介紹了基于javascript的COOkie的操作實(shí)現(xiàn)只能點(diǎn)一次,需要的朋友可以參考下2014-12-12
使用js操作css實(shí)現(xiàn)js改變背景圖片示例
有個朋友在weibo上問我可不可以用JS和CSS讓頁面每次刷新隨機(jī)產(chǎn)生一張背景圖，當(dāng)然是可以的。具體的方法看下面的實(shí)現(xiàn)代碼吧2014-03-03
js 樹組復(fù)制方法2009-02-02
這篇文章主要為大家詳細(xì)介紹了移動端效果之Swiper的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-10-10