基于WebForm+EasyUI的业务管理系统形成之旅 -- ParamQueryGrid行、列合并(Ⅸ)
上篇《基于WebForm+EasyUI的业务管理系统形成之旅 -- 施工计划查询(Ⅷ)》,主要介绍通过报表工具数据钻取,获取施工计划详细信息。
这篇我们看看ParamQueryGrid【行合并】与【列合并】
一、【列合并】效果
以编号配置界面为例,如下图所示。

设置表格列合并,代码如下。
/**设置表格列合并
colModel:列
,startNumber:开始列
,numberOfColumns:从开始列开始,合并列数量
,titleText:合并列标题
**/
function SetPqGridGroupHeaders(colModel, startNumber, numberOfColumns, titleText) {
var col = [], spanCols = [];
if (startNumber + numberOfColumns > colModel.length) {
return null;
}
for (var i = ; i < colModel.length; i++) {
if (i == startNumber) {
var iCol = i;
var nclos = { dataIndx: iCol, title: titleText, width: , align: 'center' };
var cVisibleColumns = ;
for (var j = ; j < numberOfColumns && (i + j < colModel.length); j++) {
if (!colModel[iCol + j].hidden) {
spanCols.push(colModel[iCol + j]);
cVisibleColumns++;
}
}
nclos.colModel = spanCols;
col.push(nclos);
if (cVisibleColumns > ) {
i += cVisibleColumns;
}
}
if (i < colModel.length) {
col.push(colModel[i]);
}
}
return col;
}
SetPqGridGroupHeaders(colM, 1, 2, '基础信息');
通过该方法,我们可以合并列序号从1开始,并且合并2列,列标题:'基础信息'
二、【行合并】效果
以编号配置界面为例,如下图所示。

设置表格行合并,代码如下。
/**设置表格行合并
obj_ID: 表格ID
**/
function Merge(obj_ID) {
if ($(obj_ID)) {
var data = $(obj_ID).pqGrid("option", "dataModel.data");
var trs = $(obj_ID).find("tr.pq-grid-row");
for (var i = data.length; i > ; i--) {
for (var j = trs.length; j > ; j--) {
var before = $(trs[j - ]).find("td.pq-grid-cell:nth-child(" + i + ")");
var end = $(trs[j]).find("td.pq-grid-cell:nth-child(" + i + ")");
if (end.text() == before.text()) {
var rowSpan = (end.attr("rowspan") || );
before.attr("rowspan", parseInt(rowSpan) + );
end.remove();
}
}
}
}
}
三、【行、列合并】效果
以编号配置界面为例,如下图所示。

通过NPOI导出Excel时,未能实现行、列合并Excel格式,有知道如何实现的小伙伴,留言告知一下,THX。
基于WebForm+EasyUI的业务管理系统形成之旅 -- ParamQueryGrid行、列合并(Ⅸ)的更多相关文章
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 施工计划查询(Ⅷ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 施工计划安排>,主要介绍整个施工计划列表与编辑界面. 下面看看施工计划查询(ⅠⅡⅢ ⅣⅤⅥ Ⅶ Ⅷ) 一.施工计划查询 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 施工计划安排(Ⅶ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 首页Portal界面拖拽>,主要介绍首页随客户喜好安排区块位置,更好的实现用户体验. 这两天将项目中施工计划管理归纳总结 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 首页Portal界面拖拽(Ⅵ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 构建Web界面>,主要介绍系统界面布局.导出数据等. 本篇将介绍首页Portal界面拖拽. 一.首页Portal界面拖拽 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 构建Web界面(Ⅴ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 数据统计>,主要介绍系统数据统计所采用图形.报表工具. 本篇将如何构建Web界面以及新增.编辑.导出数据等功能. 一.在 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 数据统计(Ⅳ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 首页快捷方式>,主要介绍通过添加首页快捷方式,快速进入各个应用菜单功能. 将常用的菜单功能作为快捷方式,避免由于寻找诸多 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 首页快捷方式(Ⅲ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 登录窗口>,主要是介绍系统登录界面页面设计与代码. 最近刚做完施工计划安排设计,之后将分享出来,这个系列更新不是很快,望 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 登录窗口(Ⅱ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 系统设置>,主要是介绍系统浏览器在线下载安装,这些前期准备是非常重要的. 最近忙于将工程管理系统中各个模块,用业务流程方 ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 系统设置(Ⅰ)
上篇<基于WebForm+EasyUI的业务管理系统形成之旅 -- 总体介绍>,主要介绍系统总体的界面效果和用户体验UI设计. 在MVC.MVP大行其道的今天,写WebForm该系列篇章, ...
- 基于WebForm+EasyUI的业务管理系统形成之旅 -- 总体介绍
一.系统总体介绍 企业业务管理系统是针对经营企业管理而开发的专业管理软件, 是以“精细管理.过程监控”为设计理念,全面满足企业的信息化管理需求,充分发挥专业.平台.灵活等优点. 集进销存.财务.CRM ...
随机推荐
- Clone中存在的浅克隆问题
A.java package second; public class A { String country;//国家 String province;//地区 String city;//城市 pu ...
- Homework3
1. 切换路径到想要保存的目录下,使用git init创建仓库: 2. 在仓库下创建文件Readme.txt,使用git add命令添加到暂存区和 git commit 命令提交到仓库: 3. 修改 ...
- ios 中的小技巧 - 总有你想要的 一
UITableView的Group样式下顶部空白处理 在viewWillAppear里面添加如下代码: //分组列表头部空白处理 CGRect frame = myTableView.tableHea ...
- 高性能图文混排框架,构架顺滑的iOS应用-b
About GallopGallop是一个功能强大.性能优秀的图文混排框架. Features主要用于解决以下需求: 滚动列表的性能优化.Gallop使用异步绘制.视图层级合并.观察mainRunlo ...
- webstorm 11 安装配置 grunt 时遇到的问题及解决办法
想学grunt的可以看看这篇文章,写的很有意思,教程之类的我就不写了,网上很多资料,我就记录下我遇到的问题和解决办法. http://yujiangshui.com/grunt-basic-tutor ...
- 如何循环遍历document.querySelectorAll()方法返回的结果
使用JavaScript的forEach方法,我们可以轻松的循环一个数组,但如果你认为document.querySelectorAll()方法返回的应该是个数组,而使用forEach循环它: /* ...
- Samza文档翻译 : Comparison Introduction
http://samza.incubator.apache.org/learn/documentation/0.7.0/comparisons/introduction.html 这里有一些使得Sam ...
- jmeter 测试java协议经验总结
对java协议的良好支持,是jmeter比loadrunner优秀的地方,但是坑也不少,本文将相关点都整理下来备忘 一. 依赖的jar包 使用IDE开发jemter java协议脚本时,需要导入以下几 ...
- http://www.cnblogs.com/amboyna/archive/2008/03/08/1096024.html
http://www.cnblogs.com/amboyna/archive/2008/03/08/1096024.html
- java中List集合及其遍历详解
1. 首先List<E>集合继承与Collection<E>,是一个接口. ① Collection (集合框架是JDK1.2版本出现的) ② list:是有序的,元素可 ...