首页 / LAYUI / layui数据表格隐藏列的方法介绍
layui数据表格隐藏列的方法介绍
内容导读
互联网集市收集整理的这篇技术教程文章主要介绍了layui数据表格隐藏列的方法介绍,小编现在分享给大家,供广大互联网技能从业者学习和参考。文章包含1460字,纯文字阅读大概需要3分钟。
内容图文
![layui数据表格隐藏列的方法介绍](/upload/InfoBanner/zyjiaocheng/419/e5047551c5034319825756910677a3ff.jpg)
![layui数据表格隐藏列的方法介绍 - 文章图片](/upload/getfiles/0001/2021/4/23/20210423110215118.jpg)
在使用layui做数据表格的时候,插入的数据的id是不是一组连续的数字,那么就需要用到layui的cols的type属性。
table.render({ elem: '#test' ,url:'${pageContext.request.contextPath}/findcustomers' ,cols: [[ {align:'center', title: '编号', sort: true,type:'numbers',width:100} ]] ,page: true });
我们就会获得一列有序的数列(ps:这里的必须加width属性,使用minWidth没有用,如果没用width,那么会使用layui的表格默认宽度40)
那么问题来了,我们的id怎么获取呢,难道id再开一列吗,如果id有意义,那么再开一列是可以的,如果没有意义但有需要用的话,那么把id隐藏起来更为美观。在layui2.4版本以前我们可以用layui的数据表格的done参数。
table.render({ elem: '#test' ,url:'${pageContext.request.contextPath}/findcustomers' ,cols: [[ {align:'center', title: '编号', sort: true,type:'numbers',width:100} ,{field:'cust_id', title: 'ID'} ]] ,done:function(res,curr,count){ // 隐藏列 $(".layui-table-box").find("[data-field='cust_id']").css("display","none"); } ,page: true });
可以将id隐藏,但有那么零点几秒,id的列是加载出来了,最后隐藏的。那么有没有更有效的办法呢,只能layui自己在加载的时候,实现隐藏。所以在layui2.4版本的时候,layui的cols的参数新添了hide(隐藏)属性。
table.render({ elem: '#test' ,url:'${pageContext.request.contextPath}/findcustomers' ,cols: [[ {align:'center', title: '编号', sort: true,type:'numbers',width:100} ,{field:'cust_id', title: 'ID', hide:true} ]] ,page: true });
更多layui知识请关注layui使用教程栏目。
以上就是layui数据表格隐藏列的方法介绍的详细内容。
内容总结
以上是互联网集市为您收集整理的layui数据表格隐藏列的方法介绍全部内容,希望文章能够帮你解决layui数据表格隐藏列的方法介绍所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错,欢迎将互联网集市网站推荐给程序员好友。
内容备注
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 gblab@vip.qq.com 举报,一经查实,本站将立刻删除。
内容手机端
扫描二维码推送至手机访问。