1、實現方法
想要自定義觸發layui表單驗證功能,但是官方並沒有提供這種方法
找到layui官方源碼中的form.js
將下面這部分代碼寫入form.js文件里
/**
* z:表單所在的form標簽的id
* return:是否通過驗證
**/
u.prototype.doVerify = function (z) {
var e = null,
a = f.config.verify,
s = "layui-form-danger",
c = t("#" + z),
d = c.find("*[lay-verify]");
layui.each(d, function (l, r) {
var o = t(this),
c = o.attr("lay-verify").split("|"),
u = o.attr("lay-verType"),
d = o.val();
if (o.removeClass(s), layui.each(c, function (t, l) {
var c, f = "", v = "function" == typeof a[l];
if (a[l]) {
var c = v ? f = a[l](d, r) : !a[l][0].test(d);
if (f = f || a[l][1], "required" === l && (f = o.attr("lay-reqText") || f), c) return "tips" === u ? i.tips(f, function () {
return "string" == typeof o.attr("lay-ignore") || "select" !== r.tagName.toLowerCase() && !/^checkbox|radio$/.test(r.type) ? o : o.next()
}(), {tips: 1}) : "alert" === u ? i.alert(f, {title: "提示", shadeClose: !0}) : i.msg(f, {
icon: 5,
shift: 6
}), n.android || n.ios || setTimeout(function () {
r.focus()
}, 7), o.addClass(s), e = !0
}
}), e) return e
});
return !e;
}
2、測試驗證
制定驗證規則
form.verify({
WHCode: [/.{6,12}/, "倉庫編號在6-12位"]
});
觸發條件,這里把點擊彈窗的btn1作為表單驗證的觸發條件
layer.open({
type: 1,
area: ['auto', 'auto'],
title: '倉庫編輯',
content: $("#WHAE"),
btn: ['確定', '清空'],
btn1: function (index) {
form.doVerify("WHAE");
}
})
結果如下圖