layui教程(一) form 表单的提交问题

点击打开表单页面(弹出层形式)如:

父页面打开子页面的代码

layer.open({type:2,          //类型为1时可以为html,和代码,为2时页面地址title: title,    //弹出层的标题area: [width, heigth],  //大小fixed: false, //不固定     maxmin: true, content: url,        //弹出层的地址btn: ['确定', '取消'],   //按钮名称yes: function(index,layero){var submit = layero.find('iframe').contents().find(submitButId);   //子页面提交表单的按钮submit.click();  //按钮提交表单return false;},btn2: function(){layer.closeAll();},zIndex: layer.zIndex, //重点1success: function(layero,index){
//               layer.setTop(layero); //重点2layer.iframeAuto(index);}});

子页面提交表单的按钮代码

<button style="display:none" lay-submit lay-filter="submitBut" id="submitBut"></button>
//按钮样式为隐藏,当点击弹出层的确定按钮时,相当于提交表单

子页面提交表单代码

form.on('submit(submitBut)', function(data){var loading = layer.msg('正在保存', {icon: 16, shade: 0.3, time:0});$.ajax({method:"POST",url:saveUrl,       //提交表单的地址data:data,      //提交表单的数据success:function(res){if(res.stateType == 0){var index = parent.layer.getFrameIndex(window.name);parent.layer.close(index);  parent.layer.msg(res.stateMsg, { icon: 1});parent.layui.table.reload(tableName);}else{layer.msg(res.stateMsg,{icon: 2});}},error:function(){console.log("caozuosibai")layer.close(loading);layer.msg('操作失败',{icon: 2});}});return false;  //防止表单提交两次});

注意:form.on()表单监控事件中一定要加 return false;如果不加的话,后端不会报错,而前端代码中会运行到error中,不同浏览器也有不同效果,谷歌浏览器有时会报错,火狐和其他浏览器100%报错

layui教程(一) form 表单的提交问题相关推荐

layui form表单ajax提交
<form class="layui-form" method="post" action=""><div class=& ...
button layui 点击事件_解决layui中的form表单与button的点击事件冲突问题
解决layui中的form表单与button的点击事件冲突问题 layui的form表单位置和button标签的位置重合,会使得button的click事件得不到响应,如图: 蓝色底为form的位置, ...
js实现Form表单submit提交截获数据（各浏览器通用）
js实现Form表单submit提交截获数据(各浏览器通用) js实现Form表单submit提交截获数据(各浏览器通用) No Comments | js , 安全 , PHP | by calms ...
使用ajax方法实现form表单的提交
2019独角兽企业重金招聘Python工程师标准>>> 在使用form表单的时候,一旦点击提交触发submit事件,一般会使得页面跳转,页面间的跳转等行为的控制权往往在后端,后端会控 ...
用js将form表单同时提交到两个不同页面的方法
用js将form表单同时提交到两个不同页面的方法: <script type="text/javascript"> function dosubmit(){ windo ...
form表单重复提交
现象: 后台完成数据库操作后返回到页面,这时点击浏览器的后退再提交或刷新页面,会导致form表单重复提交原因: 第一次提交的表单会被缓存到内存中,直到页面下次提交或页面关闭或转向其它页面才消失,在自 ...
.form文件_含文件上传的form表单AJAX提交小结
最近在学习PHP时,遇到不知道如何含文件上传的form表单AJAX提交,现在把这些记录下来以备自己后续复习时用: HTML代码 *姓名: *性别: {eq name='list.sex' value= ...
form表单同时提交带文本和图片的数据
方法一:使用ajax异步提交此种方法的好处是可以回调响应结果. html代码: <form action="${basePath}/save" method="p ...
防止Form表单重复提交的客户端及服务器端的方式
参考:https://www.cnblogs.com/xdp-gacl/p/3859416.html 上文只是介绍了form表单提交,没有介绍form表单异步提交上文只是介绍了单个Servlet的处 ...

layui教程(一) form 表单的提交问题

layui教程(一) form 表单的提交问题相关推荐

最新文章

热门文章