EasyUI DataGrid 合并单元格

 1 function mergeCells(){
 2         var arr =[{mergeFiled:"field",premiseFiled:""}];////合并列的field数组及对应前提条件filed(为空则直接内容合并)
 3         var dg = $("#id");   //要合并的datagrid中的表格id
 4         var rowCount = dg.datagrid("getRows").length;
 5         var cellName;
 6         var span;
 7         var perValue = "";
 8         var curValue = "";
 9         var perCondition="";
10         var curCondition="";
11         var flag=true;
12         var condiName="";
13         var length = arr.length - 1;
14         for (i = length; i >= 0; i--) {
15             cellName = arr[i].mergeFiled;
16             condiName=arr[i].premiseFiled;
17             if(!condiName){
18                 flag=false;
19             }
20             perValue = "";
21             perCondition="";
22             span = 1;
23             for (row = 0; row <= rowCount; row++) {
24                 if (row == rowCount) {
25                     curValue = "";
26                     curCondition="";
27                 } else {
28                     curValue = dg.datagrid("getRows")[row][cellName];
29                     /* if(cellName=="ORGSTARTTIME"){//特殊处理这个时间字段
30                         curValue =formatDate(dg.datagrid("getRows")[row][cellName],"");
31                     } */
32                     if(!flag){
33                         curCondition=dg.datagrid("getRows")[row][condiName];
34                     }
35                 }
36                 if (perValue == curValue&&(flag||perCondition==curCondition)) {
37                     span += 1;
38                 } else {
39                     var index = row - span;
40                     dg.datagrid('mergeCells', {
41                         index : index,
42                         field : cellName,
43                         rowspan : span,
44                         colspan : null
45                     });
46                     span = 1;
47                     perValue = curValue;
48                     if(!flag){
49                         perCondition=curCondition;
50                     }
51                 }
52             }
53         }
54     }
55
56 //<table id="deviceSerieses" class="easyui-datagrid" data-options="onLoadSuccess: mergeCells"></table>

令外表格中列选中不变色使用的是列的styler属性.

转载于:https://www.cnblogs.com/hrhlian/p/4688816.html

EasyUI DataGrid 合并单元格相关推荐

  1. 【EasyUI】DataGrid 合并单元格 - 使用实例

    官方文档 - EasyUI 合并单元格 为了合并数据网格(datagrid)单元格,只需简单地调用 'mergeCells' 方法,并传入合并信息参数,告诉数据网格(datagrid)如何合并单元格. ...

  2. easyui 合并列_Easyui DataGrid 合并单元格

    //调用 onLoadSuccess: compute, function compute() {//计算函数 autoMergeCells("Datagrid_Person_Managem ...

  3. Easyui DataGrid 改变单元格样式

    根据需求,需要对DataGrid单元格进行高亮显示 方法一: $('#dg').datagrid('gotoPage', {url: '',onLoadSuccess: function (){var ...

  4. easyui 报表合并单元格

    前段时间工作中碰到有需求,要求数据按下图所示格式来显示,当时在园子里看到了一篇文章(时间久了,想不起是哪一篇),研究了后做出了如下的DEMO,在此当作学习笔记,简单记录一下. 首先是效果图,如下: 数 ...

  5. bootstraptable合并标题_bootstrapTable 合并单元格

    /** * 合并单元格 * @param data 原始数据(在服务端完成排序) * @param fieldName 合并属性名称 * @param colspan 合并列 * @param tar ...

  6. Easyui数据表格合并单元格

    合并与不合并的数据在同一个表中: $('#table_id').datagrid({title: '标题',collapsible: true,singleSelect:true,nowrap: tr ...

  7. EasyUI DataGrid根据字段动态合并单元格

    为什么80%的码农都做不了架构师?>>>    1.合并方法 /** * EasyUI DataGrid根据字段动态合并单元格 * 参数 tableID 要合并table的id * ...

  8. 在DataGrid中合并单元格行

    最近在做项目的时候经常遇到要合并单元格的情况,发现这个东西.net中并没有现成的方法,研究了一下,总结了两种方法. 这个主要都是行合并的,有以下两种情况 1.多行合并为一行,其中将某个或某几个单元格的 ...

  9. php td居中显示文字,【html】合并单元格,并居中显示文本

    现状: 想要实现的效果: 代码实现: 用例失败为0,无测试详情 知识点: 合并单元格 rowspan是合并行,colspan 是合并列 456 实例: 1 2 3 456 效果: 2.单元格内容居中: ...

最新文章

  1. 微信小程序开发实战(三)自定义UI样式---增加减少按钮
  2. 程序员需要谨记的9个安全编码规则【转载】
  3. LeetCode Divisor Game
  4. 卡巴斯基将支持微软企业安全解决方案Forefront
  5. 破境Angular(三)Angular构件之模块
  6. Web浏览器调试工具firebug
  7. 山东理工【2871】爱
  8. 基于JAVA+SpringBoot+Mybatis+MYSQL的企业员工考勤管理系统
  9. 教你win7显卡驱动如何安装,win7电脑显卡驱动的安装方法
  10. 计算机网络网络层之数据报网络
  11. 详解tomcat的连接数与线程池--转载
  12. 十分钟理解线性代数的本质_如何理解线性代数?
  13. qss设置平面按钮_QToolButton设置QSS
  14. 基于51单片机的简易计算器
  15. 简单工厂,工厂方法,抽象工厂思想-手机时代的变迁
  16. 【数学分析入门】R语言独立性检验方法
  17. 2022·创新峰会回顾 | 擎创科技荣获CCID双料优秀成果奖
  18. oracle逗号隔开行转列_oralce逗号分割变多行-Oracle
  19. 小程序分销商城开发功能
  20. 周志华:浅谈深度学习

热门文章

  1. java 线程安全的原因_Java并发编程——线程安全性深层原因
  2. 开发函数计算的正确姿势——使用 brotli 压缩大文件
  3. git怎样用idea拉代码_一款强大的 IDEA 代码生成器,学会用,真香!
  4. php中绘画控制包括什么,PhpStorm中绘画UML
  5. windows10 + Anaconda搭建tensorflow-gpu环境
  6. php输出多维json,json多维数组怎么利用php进行构造
  7. 计算机二级c语言考生文件夹在哪,2017年全国计算机二级C语言考试题
  8. springboot接入cas单点登录后跳转不到我需要跳转到页面_单点认证的一点心得
  9. python 数据库查询序列化_python-将sqlalchemy类序列化为json
  10. 函授报计算机还是工商管理,函授本科行政管理工商管理经济管理分别都有哪......