jqGrid实现虚拟滚动和合并单元格
如图:

关键点:
1.scroll: 1, //虚拟滚动,解决大数据一次性加载慢的问题,同时解决分页
2.function merge(names)//自定义函数
$(function () {
//查询
$("#querybtn").click(function () {
var prm = {};
$("#querytb td [name]").each(function (ind, o) {
prm[o.name] = $(o).val();
});
if ($("#jqgrid").data("jqgrid")) {//已经初始化
$("#jqgrid").jqGrid("setGridParam", {
"postData": prm })
.trigger("reloadGrid");
} else {
$("#jqgrid").jqGrid({
url: 'SCHandler.ashx?action=SCResult2',
caption: "点检结果",
datatype: "json",
pager: "#pager", postData: prm,
height: ($(window).height() - 210),
colNames: ["rid", "系统", "设备名称", "部位", "项目", "点检内容", "点检时间", "点检结果", "结果说明", "处理方式", "处理结果", "点检人", "点检单位"],
colModel: [{ name: "rid", hidden: true, key: true },
{ index: "系统", name: "系统", width: 80 },
{ index: "设备名称", name: "设备名称", width: 80 },
{ index: "部位", name: "部位", width: 80 },
{ index: "项目", name: "项目", width: 80 },
{ index: "点检内容", name: "点检内容", width: 80 },
{ index: "点检时间", name: "点检时间", width: 100 },
{ index: "点检结果", name: "点检结果", width: 60 },
{ index: "结果说明", name: "结果说明" },
{ index: "处理方式", name: "处理方式" },
{ index: "处理结果", name: "处理结果" },
{ index: "点检人", name: "点检人" },
{ index: "点检单位", name: "点检单位", hidden: true }
],
rowNum: 50,
gridComplete: function () { merge(["系统", "设备名称", "部位", "项目","点检内容"]); },
cmTemplate: { editable: false, sortable: false, width: 80 }, scroll: 1,
viewrecords: true, gridview: true
}).bindKeys().data("jqgrid", true);
}
});
});
function merge(names) {
var trs = $("#jqgrid>tbody>tr:gt(0)");
$.each(names, function (ind, name) {
var bg = trs.eq(0).children("[aria-describedby='jqgrid_" + name + "']"),
index = bg.index(),
rowsp = 1;
trs.slice(1).each(function (ind2, tr) {
var me = $(tr).children("td").eq(index);
if (bg.text() === me.text()) {
rowsp++;
me.hide();
} else {
bg.attr("rowspan", rowsp);
bg = me;
rowsp = 1;
}
bg.attr("rowspan", rowsp);
});
});
}
jqGrid实现虚拟滚动和合并单元格的更多相关文章
- jqGrid合并单元格
两个参数 /**合并单元格:合并指定 gridName表格的NoName 列,合并的标准是参考CellName+CellNameTwo列内单元格的值. * gridName :表格名称 * NoNam ...
- 【表格设置】HTML中合并单元格,对列组合应用样式,适应各浏览器的内容换行
1.常用表格标签 普通 <table> | <tr> | | <th ...
- Qt高仿Excel表格组件-支持冻结列、冻结行、内容自适应和合并单元格
目录 一.概述 二.效果展示 三.实现思路 1.冻结行.冻结列 2.行高自适应 3.蚂蚁线 四.测试代码 1.添加表格数据 2.设置冻结行.列 3.行高.列宽 4.单元格背景色 5.单元格文字 6.其 ...
- C# 获取Excel中的合并单元格
C# 获取Excel中的合并单元格 我们在制作表格时,有时经常需要合并及取消合并一些单元格.在取消合并单元格时需要逐个查找及取消,比较麻烦.这里分享一个简单的方法来识别Excel中的合并单元格,识别这 ...
- jquery操作表格 合并单元格
jquery操作table,合并单元格,合并相同的行 合并的方法 $("#tableid").mergeCell({ cols:[X,X] ///参数为要合并的列}) /** * ...
- NPOI操作EXCEL(五)——含合并单元格复杂表头的EXCEL解析
我们在第三篇文章中谈到了那些非常反人类的excel模板,博主为了养家糊口,也玩命做出了相应的解析方法... 我们先来看看第一类复杂表头: ...... 博主称这类excel模板为略复杂表头模板(蓝色部 ...
- poi获取合并单元格内的第一行第一列的值
当读取如图所示的excel时,显示为第1行 第1列 的内容是:合并单元格 其它在合并单元格区域内的单元格不显示 示例代码如下: import java.io.FileInputStream; impo ...
- Repeater多列分别合并单元格
GridView.Repeater合并单元格可以参考http://www.cnblogs.com/zhmore/archive/2009/04/22/1440979.html,但是原文例子是合并一列的 ...
- Aspose.Cells 首次使用,用到模版填充数据,合并单元格,换行
Aspose.Cells 首次使用,用到模版填充数据,合并单元格,换行 模版格式,图格式是最简单的格式,但实际效果不是这种,实际效果图如图2 图2 ,注意看红色部分,一对一是正常的,但是有一对多的订单 ...
随机推荐
- 32位的CPU最多只能支持最大到4GBytes的内存
和总线宽度相似的,CPU每次能够处理的数据量称为字组大小(word size), 字组大小依据CPU癿设计而有32位与64位.我们现在所称的计算机是32或64位主要是依据这个 CPU解析的字组大小而来 ...
- Tomcat 服务器的端口号的修改
在系统中找到Tomcat安装目录下的conf文件夹下的servlet.xml文件. (1)在servlet.xml文件中找到以下代码: <connector port="8080&qu ...
- 循环与range
Python的循环有两种,一种是for...in循环,依次把list或tuple中的每个元素迭代出来,看例子: names = ['Michael', 'Bob', 'Tracy'] for name ...
- USB系列之一:列出你的USB设备
USB现在已经成为PC机必不可少的接口之一,几乎所有的设备都可以接在USB设备上,USB键盘.鼠标.打印机.摄像头,还有常用的U盘等等,从本篇文章开始,将集中篇幅介绍一下在DOS中使用USB设备的方法 ...
- 【Xamarin挖墙脚系列:Xamarin.IOS的多个Storybord分隔视图的导航】
在实际开发中,我是推荐使用画板Storybord的.也可以适当的添加xib进行界面的绘制.尽量不要用或者少用代码绘制视图.(少一些装B分子,可以极大的缩短项目的周期). 不要讲性能,不是不讲性能,ap ...
- Sed 与 Linux 等价命令代码鉴赏(转)
参考了 http://www.chinaunix.net/jh/24/307045.html sed http://bbs.chinauni ...
- Windows XP SP3中远程桌面实现多用户登陆
Windows XP SP3配置为支持多用户远程桌面连接,注意:此多用户远程桌面连接必须是不同的用户登录,不能像Windows server 2003那样,同一个用户可以同时登录,只能登陆2个不同用户 ...
- 汉子英文同行 连续英文不折行断行 的问题 兼容FIREFOX浏览器CSS
#intro {white-space: normal;word-break: break-all;overflow: hidden;} --------------------- 案例2
- Word Ladder II 解答
Question Given two words (beginWord and endWord), and a dictionary's word list, find all shortest tr ...
- ZOJ3578(Matrix)
Matrix Time Limit: 10 Seconds Memory Limit: 131072 KB A N*M coordinate plane ((0, 0)~(n, m)). I ...