layui table合并相同的列

在这里插入图片描述

	table.render({elem: '#samples',url: '/index/Develorderss/samplelists?od_id='+od_id //数据接口,page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档layout: ['prev', 'page', 'next', 'count','skip','limit'] //自定义分页布局//,curr: 5 //设定初始在第 5 页,groups:10 //只显示 1 个连续页码,first: false //不显示首页,last: false //不显示尾页},limit:10,cols: [[ //表头// ,给供应商做信笺时间,供应商回信的时间,寄客户信笺时间,确认的时间,是否确认(如果是色样就填颜色的结果),创建日期{checkbox: true, fixed: true},{field:'name',title:'类型',width:'10%'},{field:'sm_name',title:'材料',width:'10%'},{field:'color_name',title:'颜色',width:'10%'},{field:'sample_delivery',title:'交期',width:'150'},{field:'sample_delivery',title:'寄出供应商信笺',width:'150'},{field:'sample_delivery',title:'收到供应商信笺',width:'150'},{field:'sample_delivery',title:'寄出客户信笺',width:'150'},{field:'sample_delivery',title:'收到客户信笺',width:'150'},{field:'sample_delivery',title:'确认时间',width:'150'},{field:'is_confirm',title:'是否确认',width:'10%',templet:function(d){if(d.is_confirm==0){return "<div style='color:red'>不确认</div>";}else if(d.is_confirm==1){return "<div style='color:green'>确认</div>";}else{return "";}}},{field:'create_date',title:'创建日期',width:'150'},{title:'操作',width:'320',fixed:'right',templet:function(d){var str = '';str += "<div class='layui-btn' lay-event='detail'>详情</div>";	str += "<div class='layui-btn' lay-event='edit'>编辑</div>";	str += "<div class='layui-btn' lay-event='del'>删除</div>";	str += "<div class='layui-btn' lay-event='suggest'>意见资料</div>";return str;	}}]],jump:function(obj, first){if(!first){$.get('/index/Develorderss/samplelists?od_id='+od_id,{page:obj.curr},function(data){console.log(data);});}},done:function(res, curr, count) {merge(res);//调用}});
function merge(res) {var data = res.data;var mergeIndex = 0;//定位需要添加合并属性的行数var mark = 1; //这里涉及到简单的运算,mark是计算每次需要合并的格子数var columsName = ['name','sm_name'];//需要合并的列名称var columsIndex = [1,2];//需要合并的列索引值for (var k = 0; k < columsName.length; k++) { //这里循环所有要合并的列var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行for (var i = 1; i < res.data.length; i++) { //这里循环表格当前的数据var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列if (data[i][columsName[k]] === data[i-1][columsName[k]]) { //后一行的值与前一行的值做比较,相同就需要合并mark += 1;tdPreArr.each(function () {//相同列的第一列增加rowspan属性$(this).attr("rowspan", mark);});tdCurArr.each(function () {//当前行隐藏$(this).css("display", "none");});}else {mergeIndex = i;mark = 1;//一旦前后两行的值不一样了,那么需要合并的格子数mark就需要重新计算}}mergeIndex = 0;mark = 1;}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/141595.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

vmware 修改主机名称 hadoop 服务器环境配置(一)

如何在虚拟机配置主机名称&#xff1a; 1. 如图所示在/etc 文件夹下有个hosts文件。追加映射关系&#xff1a; #关系 ip地址 名称 192.168.164.20 hadoop20 2. 保存后&#xff0c;重启reboot即可

东莞松山湖数据中心|莞服务器托管的优势

东莞位于珠江三角洲经济圈&#xff0c;交通便利&#xff0c;与广州、深圳等大城市相邻&#xff0c;而且东莞是中国重要的制造业基地&#xff0c;有众多的制造业和科技企业集聚于此&#xff0c;随着互联网和数字化时代的到来&#xff0c;企业都向数字化转型&#xff0c;对于信息…

汽车一键启动智能系统功能作用

在现代科技的推动下&#xff0c;我们的生活每天都在发生着变化。其中&#xff0c;汽车智能一键启动系统就是科技改变生活的最好例子之一。 首先&#xff0c;我们来简单了解一下汽车智能一键启动系统。它是一种利用先进的电子技术和无线通信技术&#xff0c;实现无需钥匙即可启…

ubuntu利用crontab反弹shell

事情源于自&#xff0c;我利用redis未授权访问漏洞在向ubuntu的/varspool/cron/crontabs目录下创建的任务计划文件去反弹shell时&#xff0c;发现shell并不能反弹到自己的centos2上 &#xff08;1&#xff09;在ubuntu中进入/var/spool/cron/crontabs/目录 cd /var/spool/cro…

202311.13 windows通过vscode ssh远程连接到Ubuntu 连接失败 waiting for server log

关闭VScode时没有关闭终端的Ubuntu进程&#xff1f; 导致重启后不能正常连接到Ubuntu了 Windows 系统自带的cmd终端通过ssh 可以连接 应该是vscode里对Ubuntu 的服务器端配置出了问题 参考&#xff1a;记录 VSCode ssh 连接远程服务器时出错及解决方法 在Windows 的vscode里面执…

Network(二)VLAN技术与网络层解析

一 VLAN 技术与应用 1 广播域 广播域指接收同样广播消息的范围&#xff0c;在该范围中的任何一个设备发送广播&#xff0c;所有其他设备都可以收到。默认情况下交换机的所有接口属于同一个广播域 2 VLAN概述 VLAN&#xff0c;Virtual LAN (虚拟局域网) 交换机的所有接口…

xsschallenge通关攻略详解

xsschallenge通过攻略 文章目录 xsschallenge通过攻略第一关第二关第三关第四关第五关第六关第七关第八关第九关第十关第十一关第十二关第十三关 简述 xsschallenge挑战攻略 ps: 终极测试代码 <sCr<ScRiPt>IPT>OonN"\/(hrHRefEF)</sCr</ScRiPt>IPT&g…

k8s的service自动发现服务:实战版

Service服务发现的必要性: 对于kubernetes整个集群来说&#xff0c;Pod的地址也可变的&#xff0c;也就是说如果一个Pod因为某些原因退出了&#xff0c;而由于其设置了副本数replicas大于1&#xff0c;那么该Pod就会在集群的任意节点重新启动&#xff0c;这个重新启动的Pod的I…

postman的使用

Postman的环境变量以及全局变量 设置接口的环境变量&#xff08;环境变量就是全局变量&#xff09;&#xff0c;设置接口的全局变量&#xff08;全局变量是能够在任何接口里面访问的变量&#xff09; 全局变量通过 {{变量名}} 获取 接口关联 场景&#xff1a;需要将“登录接口…

SAP中销售业务的查询修改及冲销操作手册

目的 物流在销售订单发货开票出问题时进行查询分析及处理冲销的相关操作 触发条件 销售业务出现变更导致需要重新做销售或人为错误 必要条件 订单&#xff0c;交货单&#xff0c;发票己完成并过账 有用提示 在实际冲销业务过程中需要去分析&#xff0c;在了解业务的情况下去…

ACM练习——第一天

因为最近要去农大参加他们的算法邀请赛&#xff0c;然后赛制是ACM赛制的&#xff0c;所以我就直接很迷茫。 然后我就找到了牛客的ACM练习题&#xff0c;好好的练习一下ACM写法&#xff0c;而且我还要被迫写C&#xff0c;哭了。 开始钻研 1.从Java过度到C 题目源于牛客网&…

Clickhouse学习笔记(13)—— Materialize MySQL引擎

该引擎用于监听 binlog 事件&#xff0c;类似于canal、Maxwell等组件 ClickHouse 20.8.2.3 版本新增加了 MaterializeMySQL 的 database 引擎&#xff0c;该 database 能映射到 MySQL中的某个database &#xff0c;并自动在ClickHouse中创建对应ReplacingMergeTree。 ClickHous…

【赠书第4期】机器学习与人工智能实战:基于业务场景的工程应用

文章目录 前言 1 机器学习基础知识 2 人工智能基础知识 3 机器学习和人工智能的实战案例 4 总结 5 推荐图书 6 粉丝福利 前言 机器学习与人工智能是当前最热门的领域之一&#xff0c;也是未来发展的方向。随着科技的不断进步&#xff0c;越来越多的企业开始关注和投入机…

Tomcat学习

一、入门 在webapp里面必须先创建一个文件夹&#xff0c;文件夹里面放的内容&#xff0c;才会被访问到。 创建一个javaweb项目后 二、servlet 1.概述 2.servlet生命周期 3.servlet实例的创建时机 4.Servlet实例的初始化参数 5.HTTP状态码 6.servelet返回JSON数据 7.服务端设置…

2023数字科技生态大会-数字安全论坛 学习笔记

监管合规->价值创造的方向&#xff0c;在安全领域的发展方向-安全运营服务型 ICT->数字->数据 数字安全&#xff1a;网络安全数据安全 传统信息化以计算为核心&#xff0c;数字化以数据为核心 数字安全技术发展十大趋势&#xff1a; 一、 数字安全技术政策环境将不…

Linux环境实现mysql所在服务器定时同步数据文件到备份服务器(异地容灾备份场景)

目录 概述 1、建立ssh连接 1.1、操作mysql所在服务器 1.2、操作备份文件服务器 2、创建脚本实现备份以及传输 3、配置定时任务 概述 应对异地容灾备份场景&#xff0c;mysql所在服务器和本分服务器需要建立ssh连接&#xff0c;每天mysql服务器通过定时任务执行脚本&…

助力燃气安全运行:智慧燃气管网背景延展

关键词&#xff1a;城市燃气管网、智慧燃气管网、智慧管网、智慧燃气管网解决方案、智慧燃气 01背景 当前&#xff0c;随着我国城市化进程不断加快&#xff0c;城市燃气管网也不断延伸&#xff0c;运行规模庞大&#xff0c;地下管线复杂&#xff0c;不少城市建设“重地上轻地…

【Proteus仿真】【Arduino单片机】DS18B20温度计

文章目录 一、功能简介二、软件设计三、实验现象联系作者 一、功能简介 本项目使用Proteus8仿真Arduino单片机控制器&#xff0c;使用PCF8574、LCD1602液晶、DS18B20温度传感器等。 主要功能&#xff1a; 系统运行后&#xff0c;LCD1602显示传感器采集温度。 二、软件设计 /*…

数据库恢复技术

事务 含义&#xff1a;用户定义的一个数据库操作序列&#xff0c;这些操作要么全做&#xff0c;要么全不做&#xff0c;是一个不可分割的工作单位 地位&#xff1a;恢复和控制并发的基本单位 区分事务和程序&#xff0c;一个程序中包含多个事务 定义事务 事务的开始与结束…

[pytorch]设备选择以及卷积神经网络的应用

0.写在前面: 首先这篇文章还没写完,因为今天要尝试对我之前的一个框架做一个简单的更新迭代,所以目前先更新这么多. 1.关于设备的选择 首先,目前的大多数电脑都是自带一些GPU(图形计算单元,在这里被称之为cuda), 需要安装相关的驱动才能正常使用这些设备和调用他们的具体情况…