easyui datagrid 合并单元格
整理以前做的东西,这个合并单元格的问题再新浪博客也写过了。。。。。
下面这段代码是列表数据
//载入排放系数管理报表数据 function LoadEmissionReportData() { //获取计算ID var CountID = getUrlParam("CountID"); $.ajax({ type: "POST", url: "../Ashx/GetGasInventoryListInfo.ashx?type=getParamReport", data: { "CountID": "" + CountID + "" }, datatype: "text", cache: false, success: function (data) { if (data != "") { var jdata = $.parseJSON(data); $("#paramTable").datagrid({ idField: "id", //标识字段,主键 pagination: false, //是否开启分页 rownumbers: true, //行号 singleSelect: true, //是否开启单选还是多选 rownumbers: true, pageSize: , pageNumber: , title: "排放系数管理表", width: ", columns: [[ { field: , rowspan: , align: 'center' }, { field: , rowspan: , align: 'center' }, { field: , rowspan: , align: 'center' }, { field: , rowspan: , align: 'center' }, { title: }, { field: , rowspan: , align: 'center' } ], [ { field: , align: 'center' }, { field: , align: 'center' }, { field: , align: 'center' }, { field: , align: 'center' }, { field: , align: 'center' } ] ], data: jdata }); } else { AlertMsg(");//这是我们自己写的弹框js } }, error: function () { AlertMsg("); } }); $("#paramTable").datagrid({ onLoadSuccess: function (data) { ) { //调用mergeCellsByField()合并单元格 mergeCellsByField("paramTable", "ID,Ext1,SName,form"); } } }); }
合并单元格的代码
function mergeCellsByField(tableID, colList) { var ColArray = colList.split(","); //切割需要合并的列名 var tTable = $("#" + tableID); var TableRowCnts = tTable.datagrid("getRows").length;//获取整个table的行数 var tmpA; var tmpB; var PerTxt = "";//记录单元格的值 var CurTxt = ""; var alertStr = ""; PerTxt = ""; tmpA = ;//记录合并的行数 tmpB = ; //当列名为ID时 记录合并的行索引 和合并的行数 其他列则跟着从相同索引值开始合并相同的行数 //遍历表格 ; i <= TableRowCnts; i++) { if (i == TableRowCnts) { //表格为空 CurTxt = ""; } else { CurTxt = tTable.datagrid("getRows")[i]["ID"]; } if (PerTxt == CurTxt) { tmpA += ; } else { tmpB += tmpA; ; j < ColArray.length; j++) { tTable.datagrid("mergeCells", { index: i - tmpA, field: ColArray[j], //合并字段 rowspan: tmpA, colspan: null }); } tmpA = ; } PerTxt = CurTxt; } };
效果图:
easyui datagrid 合并单元格的更多相关文章
- JS实现EasyUI ,Datagrid,合并单元格功能
为了实现datagrid的合并单元格效果,datagrid的数据加载方式肯定是要写在JS文件内部的. 一:在JS内部添加Datagrid数据加载方法如下: $("#id").dat ...
- easyui datagrid单击单元格选择此列
示例代码实现单击jquery easyui datagrid的单元格时,取消datagrid默认选中高亮此行的样式,改为选中单击的单元格所在的列,高亮此列上的所有单元格.可以配置全局single变量, ...
- 扩展jquery easyui datagrid编辑单元格
扩展jquery easyui datagrid编辑单元格 1.随便聊聊 这段时间由于工作上的业务需求,对jquery easyui比较感兴趣,根据比较浅薄的js知识,对jquery easyui中的 ...
- Silverlight的DataGrid合并单元格
现在也不知道还有没有同学做Silverlight开发了,我是一个Silverlight菜鸟,遇到问题也很难百度查到.就简单的记录一下这两天遇到的问题,并做了一个简单的小Demo,希望能够帮助到其他同学 ...
- WPF DataGrid 合并单元格
在网上搜索wpf合并单元格,一直没搜索到,没办法,只能自己想办法搞定了.其实就是DataGrid套DataGrid,为了方便支持Column拖动,在合并的DataGridColumn那一列的Heade ...
- EasyUI DataGrid合并单元
<table id="tt"></table> $('#tt').datagrid({ title:'Merge Cells', iconC ...
- DataGrid合并单元格(wpf)
在网上搜索wpf合并单元格,一直没搜索到,没办法,只能自己想办法搞定了.其实就是DataGrid套DataGrid,为了方便支持Column拖动,在合并的DataGridColumn那一列的Heade ...
- Easyui datagrid 扩展单元格textarea editor
datagrid 扩展单元格textarea editor by:授客 QQ:1033553122 测试环境 jquery-easyui-1.5.3 问题描述 如下,在没有扩展的情况下,初始化如下 手 ...
- C# DataGrid合并单元格
1.栏位枚举 private enum DataGridColumn { ROWNUM = , EMPID, EMPNAME, SEX, SALARY, ADRRESS, PHONE, TEL, PO ...
随机推荐
- Cookie与Session用法
以下是Cookie的完整实例 MyEclipse新建web Project工程,建两个jsp文件,如下 1.login.jsp <%@ page language="java" ...
- 修改UISearchBar的背景颜色
当你看到这篇博客你就已经发现了用_searchBar.backgroundColor = [UIColor clearColor];来设置UISearchBar的颜色完全没有效果: 并且,有些方法是想 ...
- CentOS 5系统安装Django、Apache 、mod_wsgi部署Python环境教程
Django,是一款针对Python环境的WEB开发框架,能够帮助我们构架快捷.简单的WEB框架设置,Django框架非常适合开发内容应用环境,所以在本文中,麦子将整理基于Centos系统部署安装Dj ...
- RBAC类的方法
rbac类的 方法 authenticate($map,$model='')方法 传入查询用户的条件和用户表的MODEL 返回数组包含用户的信息 saveAccessList($authId=null ...
- Makefile 一点一滴(三)—— 尝试简单的变量替换
上一版的 makefile: TestCpp : ./debug/TestCpp.o g++ -o TestCpp ./debug/TestCpp.o ./debug/TestCpp.o : ./sr ...
- Oracle存储过程中异常Exception的捕捉和处理
Oracle存储过程中异常的捕捉和处理 CREATE OR REPLACE Procedure Proc_error_process ( v_IN in Varchar2, v_OUT Out Var ...
- VMware-workstation-full-12.0.0-2985596&VMware-player-12.0.0-2985596
VMware-workstation-full-12.0.0-2985596 永久KEY:YV3D2-A0D50-481XP-KPNGE-ZV2ZF VMware-player-12.0.0-2985 ...
- 4.3.5 使用Http:// (Https://)协议连接到ActiveMQ 2015年9月28日
用到的几点地方: 1.服务器端 ActiveMQ的文件activemq.xml中,预先要定义好有关本协议http的传输连接器格式,抓图如下: 2. 然后,开启Eclipse环境,在publish ...
- Fiddler-2 Fiddler抓包原理
1 fiddler抓包是在 客户端和服务器之间建立一个代理服务器,监听本机发出的请求和服务器返回的响应结果. 截一张官网的图: 2 启动fiddler之前,[dinghanhua]先来看一下代理服务器 ...
- C++引用的作用和用法
引用就是某一变量(目标)的一个别名,对引用的操作与对变量直接操作完全一样. 引用的声明方法:类型标识符&引用名=目标变量名: 例如: int q; int &ra=a; 说明: &am ...