layui中table数据表格隐藏列的方法介绍

layui中table数据表格隐藏列的方法介绍

现在国内的模板,也就layui一家独大了,其中的数据表格功能强大,但我不会用python或者django拼接json,输出发送给数据表格,那只好用笨办法,循环遍历吧。

数据表格中保留id列,是为了编辑修改的时候获取改行数据的id值,但又不需要展示出来,所以需要隐藏。

id列的代码是:

, cols: [[ //标题栏                    {field: 'data_id', title: 'ID', width: 50,style:'display:none;'}

登录后复制

这个代码就可以把下面的id列的值隐藏起来,但标题栏的id还在,那么,问题来了,就用强大的jquery解决呗。

 $('table.layui-table thead tr th:eq(0)').addClass('layui-hide');

登录后复制

当有多个表格的时候,发现上面的代码只能把第一个表的第一列标题栏给隐藏起来,如果一个页面有多个表格需要用:

 $('table.layui-table thead tr th:nth-child(1)').addClass('layui-hide');

登录后复制

还有问题,如果表格中有选择框,默认会占据表格第一列,这个时候,上面的代码就出错了。只能推到,使用第一个代码,一个一个的选择。注意,layui的数据表格,自动会生成5个表格:

1.jpg

我当前页面只有两个表格,一个常规,一个有选择框,搜索发现里面竟然有10个

 $('table:eq(1).layui-table thead tr th:eq(0)').addClass('layui-hide');$('table:eq(6).layui-table thead tr th:eq(1)').addClass('layui-hide');

登录后复制

更多layui知识请关注layui使用教程栏目。

以上就是layui中table数据表格隐藏列的方法介绍的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2598882.html

(0)
上一篇 2025年3月6日 18:41:19
下一篇 2025年2月27日 12:27:41

AD推荐 黄金广告位招租... 更多推荐

相关推荐

发表回复

登录后才能评论