1、当使用layer.open打开一个iframe的子页面:进行添加编辑时,保存提交是在layer.open()中进行处理的。
问题来了:当我们提交表单时,就要获取form表单对象
第一种:在layer.open中iframe页面的form提交:使用form.submit() 这种提交是没有返回结果的,单向的提交。
【这种会导致刷新列表不好控制,提交后台还未处理完直接刷新,造成数据问题】
layer.open({
title: title, type: 2, offset: '150px', //弹窗居中 area: [width, height], content: addurl, btn: ['保存', '关闭'], success: function(layero, index){ //成功打开弹窗事件 alert(22); //var loading = layer.load(1, {shade: [0.1, '#fff']}); }, yes: function(index, layero){ //保存按钮事件 //拿到的是form表单所有元素对象 var form = layero.find("iframe").contents().find("body").find('#formobj')[0]; form.submit(); //提交表单,没有返回结果,不好处理
layer.close(index); layer.msg("操作成功", {icon: 1, time: 3000}); location.reload(); //刷新页面 }, end: function(){ //关闭按钮事件 //location.reload(); //刷新页面 } });
第二种:使用ajax提交form表单,得到返回结果再处理
【
主要是这段代码:拿到form表单所有字段的序列化值,提交到后台
top.layer.getChildFrame('body',index).find("#formobj").serialize();
】
layer.open({ title: title, type: 2, offset: '150px', //弹窗居中 area: [width, height], content: addurl, btn: ['保存', '关闭'], success: function(layero, index){ //成功打开弹窗事件 alert(22); //var loading = layer.load(1, {shade: [0.1, '#fff']}); }, yes: function(index, layero){ //保存按钮事件 //拿到的是form表单所有元素对象 var form = layero.find("iframe").contents().find("body").find('#formobj')[0]; //拿到form表单的所有字段参数并序列化:id=&orgId=1234&operType=test2224 var formParam = top.layer.getChildFrame('body',index).find("#formobj").serialize(); //form.action可得到form表单的action属性,它的值路径 //使用ajax提交form表单 //请求后台 $.ajax({ async : false, cache : false, type : 'POST', dataType: "json", data : formParam, url : form.action,// 请求的action路径 error : function() {// 请求失败处理函数 }, success : function(data) { } });
}, end: function(){ //关闭按钮事件 //location.reload(); //刷新页面 }
});
。
标签:function,layer,提交,form,layui,表单,iframe,find From: https://www.cnblogs.com/spll/p/17551596.html