layui form表单提交之后重新加载数据表格的方法
2019-09-11 17:43
3703 查看
HTML form表单
<p style="text-align: center"><img src="//files.jb51.net/file_images/article/201909/20190911173925.jpg" alt="" /></p> <div class="layui-row"> <form class="layui-form layui-col-md12 x-so" id="zq_search"> 菜单:<input id="name" type="text" name="name" placeholder="请输入菜单" autocomplete="off" class="layui-input"> <button id="search" class="layui-btn" lay-submit="" lay-filter="search"><i class="layui-icon"></i></button> </form> </div>
JS
$(function () { //注意:这里是数据表格的加载数据,必须写 layui.use(['table', 'layer', 'form', 'laypage', 'laydate'], function () { var table = layui.table //表格 ,layer = layui.layer //弹层 ,form = layui.form //form表单 // .................. //监听提交 lay-filter="search" form.on('submit(search)', function(data){ var formData = data.field; var name = formData.name, url=formData.url, icon=formData.icon, parent_id=formData.parent_id; //执行重载 table.reload('tableReload', { page: { curr: 1 //重新从第 1 页开始 } , where: {//这里传参 向后台 name: name //可传多个参数到后台... ,分隔 } , url: '/menu/page'//后台做模糊搜索接口路径 , method: 'post' }); return false;//false:阻止表单跳转 true:表单跳转 }); }); });
最后如果还有不懂的可以参考layui官方文档:https://www.layui.com/doc/modules/table.html#reload
以及 layui模板在线演示: https://www.layui.com/doc/modules/table.html#reload
以上这篇layui form表单提交之后重新加载数据表格的方法就是小编分享给大家的全部内容了,希望能给大家一个参考
您可能感兴趣的文章:
相关文章推荐
- Jquery serialize() serializeArray()方法提交form表单数据
- 获取form表单提交回来的值或者html标签的值或者加载过后重新给lable赋的值
- Form表单只提交数据而不进行页面跳转的方法
- java实现将文件上传到本地的ftp服务器中(layui前端框架form表单数据与图片一起提交)
- Html表单提交到Servlet输出到页面乱码 Html使用的编码是UTF-8编码显示页面,之后使用form表单提交字段到Servlet中,Servlet将利用getParamer方法获得fo
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Ext JS4 学习笔记之发送表单(Form)时也将表单下的表格(Grid)数据一同发送的方法
- multipart/form-data post 方法提交表单,后台获取不到数据
- 大表格,多Form元素的提交 判断表单数据是否有被修改过
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- Form表单只提交数据而不进行页面跳转的方法
- 在phpstorm中利用post方法提交form表单后,在响应页面获取不到数据的解决办法
- android利用httpclient实现post、get请求restful接口进行json和form表单数据提交等公共方法类