基于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 ...
随机推荐
- 【BZOJ 2654】tree
Description 给你一个无向带权连通图,每条边是黑色或白色.让你求一棵最小权的恰好有need条白色边的生成树. 题目保证有解. Input 第一行V,E,need分别表示点数,边数和需要的白色 ...
- 微软职位内部推荐-Sr SDE-MOD-Beijing
微软近期Open的职位: JOB TITLE: Senior Software Design EngineerDEPARTMENT: Microsoft Office Division ChinaIM ...
- BeanFactory和FactoryBean
BeanFactory和FactoryBean 1.BeanFactory BeanFactory定义了 IOC 容器的最基本形式,并提供了 IOC 容器应遵守的的最基本的接口,也就是Spring I ...
- c++ string char* const char*
#include <iostream> #include <string> #include <cstring> using namespace std; int ...
- IntelliJ IDEA 部署Tomcat及创建一个web工程
一.部署Tomcat 二.新建一个web工程 1.新建一个Project 2.现在建立一个简单的web工程,所以只勾选下面选中的,此外,本版本(IntelliJ IDEA 14.1.5只支持3.1版本 ...
- HTML5 中的块级链接
英文叫做 “Block-level” links,我以为只有我厂那些鸟毛不知道,没想到不知道的还挺多, 需要普及一下. 最近看了 kejun 的 PPT 前端开发理论热点面对面:从怎么看,到怎么做?, ...
- API断点大全
1.限制程序功能函数 EnableMenuItem 允许.禁止或变灰指定的菜单条目EnableWindow 允许或禁止鼠标和键盘控制指定窗口和条目(禁止时菜单变灰) 2.对话框函数 CreateDia ...
- 几款国产开源的Windows界面库
上次介绍的几款图形界面库http://blog.okbase.net/vchelp/archive/23.html都是国外的开源项目,今天介绍的几款都是国人的开源项目,大部分是采用DirectUI设计 ...
- linux踢人命令 pkill踢人用法
首先使用who命令查看在线用户,然后踢人. 强制踢人命令格式:pkill -kill -t tty 解释: pkill -kill -t 踢人命令 tty 所踢用户的TTY或者pts/x(x代表数字) ...
- http://www.cnblogs.com/doit8791/p/4093808.html
http://www.cnblogs.com/doit8791/p/4093808.html