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,一经查实,立即删除!

相关文章

【C语言】sem_timedwait

sem_timedwait 是 POSIX&#xff08;便携式操作系统接口&#xff09;标准定义的一个同步原语&#xff0c;用于线程或进程同步中的信号量操作。在涉及多线程编程时&#xff0c;信号量(semaphore)是用来控制对共享资源或临界区域访问的一种机制。 sem_timedwait函数对信号量执行…

并发线程使用介绍(二)

2.2.6 线程的强占 Thread的非静态方法join方法 需要在某一个线程下去调用这个方法 如果在main线程中调用了t1.join()&#xff0c;那么main线程会进入到等待状态&#xff0c;需要等待t1线程全部执行完毕&#xff0c;在恢复到就绪状态等待 CPU调度。 如果在main线程中调用了t1.j…

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 (虚拟局域网) 交换机的所有接口…

如何成为你那个领域的高手

成为高手最重要的就懂得刻意练习。 刻意练习是指为了提高某一成绩而被刻意设计出来的练习&#xff0c;它要求我们离开自己的熟练和舒适区域进行训练。 一、刻意练习需要 1. 有目的、有目标、带着问题训练 2. 训练中必须专注 3. 必须跳出舒适区进行训练 要想想自己现在正在做…

Linux的wc

Linux的wc wc 是一个用于统计文件中字节数、字数和行数的命令。它的名称代表 “word count”&#xff0c;但实际上它可以提供更多的信息&#xff0c;包括文件的行数、字节数以及字数的统计。 基本语法&#xff1a; wc [options] [files]常见选项和参数&#xff1a; 统计行数…

GEE教程——将多段线按照等距离分割,并且分别获取每个线段上的点形成一个矢量集合

简介: 我正在寻找一种沿直线采样但沿几何形状统一的方式采样的方法最佳情况下,我提供一个值 n,即点的数量,它们将沿线分布。 这里主要的问题就是我们需要获取线段指定线段的点,这里就是获取整个线段的长度,然后根据线段的长度进行等距离分割,并且设定指定的步长,然后…

神经网络激活函数的使用

我们都知道神经网络模型中使用激活函数的主要目的是将非线性特性引入到我们的网络中&#xff0c;强化网络的学习能力。激活函数应用于隐藏层和输出层中每个节点的称为 z 的输入加权和&#xff08;此处输入可以是原始数据或前一层的输出&#xff09;。 在本篇文章中我们将讨论神…

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;在了解业务的情况下去…

JS 注释

JavaScript 不会执行注释&#xff0c;我们可以添加注释来对 JavaScript 进行解释&#xff0c;或者提高代码的可读性。 1.单行注释 单行注释以//开头。 以下代码中&#xff0c;单行注释用来对代码进行解释&#xff1a; <script>//定义点击次数的变量var clickCount 0;…

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;越来越多的企业开始关注和投入机…