layui表單 lay-verify的使用
需求是選擇通過直接提交怔鳖,不通過要填寫不通過原因且必填。
我的代碼是這么處理的:
不通過原因表單先寫在html里明垢,display為none,當(dāng)選擇不通過時(shí),讓表單不通過原因display:block. 顯示隱藏的思路沒錯(cuò),就是在表單選擇通過提交時(shí)痛悯,會(huì)校驗(yàn)不通過原因表單,實(shí)際是不需要校驗(yàn)的重窟。
第一種思路是载萌,動(dòng)態(tài)修改lay-verify,表單通過,值為空巡扇,表單不通過扭仁,值required
html里不能獲取 通過不通過值,所以行不通厅翔。瀏覽layui官方文檔表單驗(yàn)證部分發(fā)現(xiàn)乖坠,lay-verify支持自定義,這就好辦了刀闷。
只要在自定義函數(shù)中獲取選擇 通過不通過的值來判斷熊泵,或者不通過原因顯示時(shí)返回校驗(yàn)提示即可
parent.form.verify({
reason: function(val){
var display = $('#noPassReason', window.parent.document).css("display");
if(display=="block" && val == ''){
return '必填項(xiàng)不能為空'
}
}
})
其實(shí)就兩點(diǎn):?jiǎn)蝹€(gè)表單元素可以設(shè)置自定義校驗(yàn),display為none的表單會(huì)被layui自動(dòng)校驗(yàn),如果表單不需要顯示涩赢,直接設(shè)置type="hidden",表單也不會(huì)校驗(yàn)了
在這里附上文檔地址:(https://www.layui.com/doc/modules/form.html#verify
)