Layui的数据表格增删改,后端回传json格式封装

Layui的数据表格增删改,后端回传json格式封装,第1张

最近有个需求,实现前端页面一个数据表格可编辑,随原页面的表单提交json数据,然后后端回传显示。Layui原来也没怎么用过,记个笔记记录一下。

添加行的有个小bug,超过分页行数后,再添加会变成无数据。所以只好初始设置分页为50。

另外,搞了个隐藏的标签随表单一起提交:

从数据表格的缓存中获取表格内输入的值放入标签:

这个之前从table的缓存中提取得到提交的json串含有Layui数据表格的索引,回传Layuitable显示的时候不需要,需要去掉。所以后端用了个正则表达式去除。

为了满足layui数据表格的返回格式,封装了一下数据格式。

使用layui的table功能时,在参考官方文档 layui数据表格 情况下,修改 工具栏左侧显示默认的内置模板。

      toolbar: 'default'  //让工具栏左侧显示默认的内置模板

       左侧的内置以layui-icon显示的 *** 作按钮就展示出来,如图所示-左侧部分

但有时根据项目需求,不需要显示 添加 编辑 删除中的某一个或者某两个功能时,我们可以如下 *** 作:

点击功能方法参考官网文档即可;

例如:不想自定义一个复杂的导出功能,在使用官网给的例子的情况下,使用自己的导出方法。删除掉默认模板导出功能,如下图所示:

总结:利用官网文档学习使用layui框架,再此基础上进行修改和完善达到我们想要的功能。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/bake/11435153.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-16
下一篇2023-05-16

发表评论

登录后才能评论

评论列表(0条)

    保存