利用layer實現(xiàn)表單完美驗證的方法
更新時間:2019年09月26日 10:46:00 作者:TigerZhang
今天小編就為大家分享一篇利用layer實現(xiàn)表單完美驗證的方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
如下所示:
//基于layer框架之上,驗證表單時引用。彈出提示錯誤
function qxMsg(msgStr) {
layer.open({
type: 1,
title: '提示消息',
offset: '10%;',
content: '<div style="padding: 20px 80px;">'+msgStr+'</div>',
btn: '關(guān)閉',
btnAlign: 'c',
shade: 0.2,
yes: function() {
layer.closeAll();
}
});
}
上邊是封裝好的layer方法,下邊是結(jié)合表單開始驗證
//表單驗證
function checkForm() {
var err = "";
if(!$('input[name="ggName"]').val()) {
err += "<br/>名稱不能為空";
}
if(!$('input[name="isId"]').val()) {
err += "<br/>空間分類不能為空";
}
if(err) {
err = err.substring(5);
qxMsg(err);
return 0;
}
return 1;
}
在ajax提交表單之前調(diào)checkForm方法即可,如:
//提交新增數(shù)據(jù)
function addGgBaseModel() {
var flag = checkForm();
if(flag == 0) return;
var formData = new FormData(document.getElementById("myform"));
formData.append("SysType", "10101");
formData.append("SysName", "qxPC");
formData.append("ModuleName", "規(guī)格型號");
$.ajax({
type: 'post',
url: _URL_BASE + '/ggBaseModel/addGgBaseModel ',
data: formData,
cache: false,
contentType: false,
processData: false,
dataType: 'json',
success: function(retData) {
console.log(retData);
if(retData.ReturnType == "1001") {
qxMsg("添加成功");
$(".layui-layer-btn0").click(function() {
$('.modal-backdrop').remove();
$("#myModal").hide();
getGgBaseModel();
})
} else if(retData.ReturnType == "4004") {
kickout();
} else {
qxMsg(retData.Message);
}
},
error: function(retData) {
qxMsg("提交數(shù)據(jù)出錯");
}
});
};
以上這篇利用layer實現(xiàn)表單完美驗證的方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
js確認(rèn)刪除對話框適用于a標(biāo)簽及submit
這篇文章主要介紹的是一個js確認(rèn)刪除對話框適用于a標(biāo)簽及submit,非常好用,需要的朋友不要錯過2014-07-07
javascript 實現(xiàn)子父窗體互相傳值的簡單實例
本篇文章主要是對javascript 實現(xiàn)子父窗體互相傳值的簡單實例進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-02-02
Echarts實現(xiàn)點擊列表聯(lián)動餅圖的示例代碼
本文主要介紹了Echarts實現(xiàn)點擊列表聯(lián)動餅圖的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05
promise結(jié)合requestAnimationFrame用法示例
這篇文章主要為大家介紹了promise結(jié)合requestAnimationFrame用法示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2022-11-11
使用typescript改造koa開發(fā)框架的實現(xiàn)
這篇文章主要介紹了使用typescript改造koa開發(fā)框架的實現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-02-02
javascript html5輕松實現(xiàn)拖動功能
這篇文章主要為大家詳細(xì)介紹了javascript html5輕松實現(xiàn)拖動功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-03-03

