layui按条件隐藏表格列的实例
我就废话不多说了,直接上关键代码吧!给大家做个参考
layui.use(['table','form','laypage'], function() { var table = layui.table ,form = layui.form ,laypage = layui.laypage; layer.load(0); setTimeout(function() { table.render({ id:"item",//用作于隐藏列名为item的列 elem: '#QD', url:path+'test.do', cols: [[ //表头 {field: 'quoted_price',title: '价格1',width: 150,align: 'left'}, {field: 'quoted_price2',title: '价格2',width: 150,align: 'left'} ]] ,where: {"page":page,"limit":limit} ,done: function(res, curr, count){ if(test== 0){//此处test为你的条件值 $("[data-field='quoted_price1']").css('display','none'); //关键代码 } if(test2== 0){//此处test2为你的条件值 $("[data-field='quoted_price2']").css('display','none');//关键代码 } } laypage.render({//分页 elem: 'page' ,count:count ,curr:page ,limit:limit ,jump: function(obj, first){ if(!first){ getRFQ_table(obj.curr,obj.limit); } } }); } });
以上这篇layui按条件隐藏表格列的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
关于Layui Table隐藏列问题
layui没有提供Table隐藏列的功能(只是写这个文档的时候没有提供). 第一步:获取Layui的TableBox Jquery对象 var _table_box = $(this._table_elem).next().find(".layui-table-box"); this._table_elem 是指的Table标签的ID layui-table-box 是layui的类名 第二步:将需要隐藏的列添加 display:none 的样式 : _table_box.find(&
-
解决layui表格内文本超出隐藏的问题
只需要更改样式即可 图片: 代码如下 .layui-table-cell{ height:auto; overflow:visible; text-overflow:inherit; 以上这篇解决layui表格内文本超出隐藏的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
layui按条件隐藏表格列的实例
我就废话不多说了,直接上关键代码吧!给大家做个参考 layui.use(['table','form','laypage'], function() { var table = layui.table ,form = layui.form ,laypage = layui.laypage; layer.load(0); setTimeout(function() { table.render({ id:"item",//用作于隐藏列名为item的列 elem: '#QD', url:p
-
Python django搭建layui提交表单,表格,图标的实例
利用layui制作与众不同的感谢表单,表格 layui极大的提高了前端开发效率,它极具个性的样式等等都非常吸引人,接下来我将为大家展示如何利用Python的django框架与layui制作极富个性的表单与数据表格 注:忽略创建项目,配置文件,若这部分内容不太明白,参考教你使用Django搭建一个基金模拟交易系统,里面会教你从项目创建到最终运行的完整流程. 第一步:在templates目录下新建一个index.html文件(文件内容根据自己的业务需求在layui官网复制即可),同时改变其布局只需将
-
FF下 用 col 隐藏表格列的方法详解!
今天,我在一个有52个字段的报表时,迫使我深入的做了一下研究, 我发现: col在ff下的display 的默认值是:table-column visibility的默认值为:visible 我又查查了CSS手册,发现 visibility 有一个 collapse的可选值,据说在IE下是没有实现的,IE没实现不竺于FF没有实现,就像FF不支持的不一定IE不支持一样. BT的我,一个一个试了一遍, 终于发现了! FF下可以用下面的方法,用COL把表格的列给隐藏! 欢呼! 复制代码 代码如下:
-
javascript 极速 隐藏/显示万行表格列只需 60毫秒
隐藏表格列,最常见的是如下方式: 复制代码 代码如下: td.style.display = "none"; 这种方式的效率极低.例如,隐藏一个千行表格的某列,在我的笔记本(P4 M 1.4G,768M内存)上执行需要约 4000毫秒的时间,令人无法忍受.例如如下代码: 复制代码 代码如下: <body> <input type=button onclick=hideCol(1) value='隐藏第 2 列'> <input type=button on
-
Vue实现动态控制表格列的显示和隐藏
本文实例为大家分享了Vue实现动态控制表格列的显示和隐藏的具体代码,供大家参考,具体内容如下 效果如图: 表头标题是重复的.为了能看到滚动效果 v-if=“lists[0].ispass” 来判断表格列的状态每一列是否显示或隐藏 勾选则展示.取消勾选隐藏.默认勾选 <el-dropdown :hide-on-click="false"> <i class="iconfont icon-shaixuan" ></i
-
vue实现动态控制el-table表格列的展示与隐藏
本文实例为大家分享了vue动态控制el-table表格列的展示与隐藏的具体代码,供大家参考,具体内容如下 1.引入el-table组件,这里我直接用官网的示例代码 <template> <div class="page"> <el-popover width="60" trigger="click"> <el-checkbox-group v-model=&
-
vue实现动态控制表格列的显示隐藏
本文实例为大家分享了vue实现动态控制表格列显示隐藏的具体代码,供大家参考,具体内容如下 一.效果 如上图所示,点击table右上方的表格按钮,弹出菜单栏,进行勾选,从而达到表格对应列显示和隐藏 二.代码 1.HTML部分 <template> <div id="app"> <el-table :data="tableData" border style="width: 100%" ref="t
-
jquery关于表格及表格列隐藏和显示问题探讨
1.关于指定表格指定列隐藏显示 复制代码 代码如下: $(":checkbox[name*=month]").each(function(){ if(!$(this).attr("checked")){ var colnum = $(this).val(); $("#listPage").find('tr').find("td:eq(" + colnum.toString() + ")").hide();
-
使用layui 渲染table数据表格的实例代码
先上最终效果图: 1,引入layui的css和js文件 <link rel="stylesheet" href="lib/layui/css/layui.css" rel="external nofollow" > <script src="lib/layui/layui.js"></script> 2,在页面放置一个table元素 <table class="layui-h
-
layui表格 列自动适应大小失效的解决方法
如下所示: 从官网复制的表格,修改成自适应宽度后失效,原因如下: 以上这篇layui表格 列自动适应大小失效的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
随机推荐
- angular动态删除ng-repaeat添加的dom节点的方法
- php实现字符串反转输出的方法
- Windows98/2000安装与卸载技巧
- java启动线程的3种方式对比分析
- JavaScript获取网页中第一个图片id的方法
- ASP.NET My97DatePicker日期控件实现OA日期记事功能
- PHP网页游戏学习之Xnova(ogame)源码解读(十三)
- python操作日期和时间的方法
- C#实现数据包加密与解密实例详解
- MySQL数据备份之mysqldump的使用详解
- 如何在JavaScript中实现私有属性的写类方式(二)
- 高性能WEB开发 为什么要减少请求数,如何减少请求数!
- 位运算实现十进制转换为二进制
- bootstrap3 dialog 更强大、更灵活的模态框
- JavaScript实现分页效果
- 10条建议帮助你创建更好的jQuery插件
- jquery.serialize() 函数语法及简单实例
- android横竖屏切换不重启activity解决方案
- C# 当前系统时间获取及时间格式详解
- Android StringBuffer的使用方法详解