有时,我们需要给jqgrid设置多表头信息,多表头区域会有行合并/列合并,如何实现?

1)通过jqgrid的 setGroupHeaders 方法来实现一个行的多表头,

2)如果有多行表头,需要设置多个 setGroupHeaders 方法

3)多行表头时,设置的 setGroupHeaders 方法的先后顺序就是多表头从上到下的显示顺序

4)setGroupHeaders 值的属性说明,如下表:

useColSpanStyle ture:是否自动向上合并没有多表头的列
groupHeaders->startColumnName 从哪个列开始合并(多表头行)
groupHeaders->numberOfColumns 合并几个单元格(多表头行)
groupHeaders->titleText 合并项的显示内容

参考代码如下(两行多表头):

            $('#jqGrid').setGroupHeaders(
{
useColSpanStyle: true,
groupHeaders: [
{ "numberOfColumns": 5, "titleText": "<a href='HtmlPage1.html'>big big big</a>", "startColumnName": "OrderID" }]
}); $('#jqGrid').setGroupHeaders(
{
useColSpanStyle: true,
groupHeaders: [
{ "numberOfColumns": 3, "titleText": "<a href='HtmlPage1.html'>Price</a>", "startColumnName": "OrderID" },
{ "numberOfColumns": 2, "titleText": "Secondary Details", "startColumnName": "Freight" }]
});

参考地址:

jqGrid表格插件实现多行表头的解决办法

jqgrid 设置多表头的更多相关文章

  1. Jqgrid入门-Jqgrid设置二级表头(六)

    上一章已经说明了Jqgrid结合Struts2+json展示数据,这一章主要探讨Jqgrid如何设置二级表头,类似这样的效果.如:           要实现这个功能,其实也不难.通过Jqgrid的s ...

  2. ASP设置动态表头

    /// <summary> /// 设置动态表头 /// </summary> /// <param name="sender"></pa ...

  3. Bootstrap Table踩坑——设置多级表头后只显示第一级表头问题解决办法

    今天设置了Bootstrap Table的复杂表头,设置了多级表头(两行列名),但是只能显示第一级表头(第一行的列名),第二级的表头被第一级的表头覆盖.但是我仿照其他网上的其他设置复杂表头例子都能正常 ...

  4. JqGrid 多行表头设置

    1.我想要统计的效果是这样的 2.只要在初始化表格中加上如下代码就可以了: jQuery("#tbAbroadStatisticByUnit").jqGrid('setGroupH ...

  5. jqgrid 设置冻结列

    有时,jqgrid表格的列非常多,而表格的宽度值是固定的,我们需要在表格底部出现滚动条,并且固定前面几个列作为数据参照项,如何实现? 需要用的jqgrid冻结列,步骤如下: 1)设置需要冻结的列属性, ...

  6. jqgrid 设置单元格编辑/不可编辑

    首先设置不可编辑,如下代码: $(', 'not-editable-cell'); 在单元格上设置一个'not-editable-cell'就可以了,如果需要设置为可编辑,那么可以使用下面的代码: f ...

  7. jqgrid设置单元格数据

    $("#gridid").jqGrid('setCell',rowid,icol,data); rowid为行ID,jqgrid内置的那个,从1开始 icol为列索引,从0开始, ...

  8. jqgrid 设置隔行换色

    有时,为美观效应,需要设置jqgrid隔行换色.jqgrid提供altRows属性来配置 启动隔行换色:altRows: true,//隔行换色 $("#filterGrid"). ...

  9. jqgrid 设置行编辑为本地端编辑状态

    有时,我们需要在jqgrid表格中做编辑操作,而jqgrid默认是启动了行保存连接到服务器更新.此时,如果没有指定editurl的有效url值时会报错 有时,我们需要将编辑完的表格数据一次性提交保存( ...

随机推荐

  1. 洛谷P2045 方格取数加强版(费用流)

    题意 题目链接 Sol 这题能想到费用流就不难做了 从S向(1, 1)连费用为0,流量为K的边 从(n, n)向T连费用为0,流量为K的边 对于每个点我们可以拆点限流,同时为了保证每个点只被经过一次, ...

  2. js-ES6学习笔记-Class(4)

    1.Object.getPrototypeOf方法可以用来从子类上获取父类.因此,可以使用这个方法判断,一个类是否继承了另一个类. 2.super这个关键字,既可以当作函数使用,也可以当作对象使用.在 ...

  3. jquery 下拉框插件,实现智能补全,模糊搜索,多选

    近期已朋友问我问题,实现类似淘宝百度的下啦搜索条,看了网上好多帖子,都看起来好复杂,而且引用了好多没用的东西,而且多选选择内容多之后容易样式奔溃, 无奈之下只好自己改了, 话不多说上效果图: 模糊搜索 ...

  4. Windows10系统的Linux子系统中安装MySQL数据库心得

    后端开发童鞋们, 自己开发机用的是Windows系统电脑(台式机或笔记本), 而开发的程序和使用的数据库等要运行在Linux服务器上, 这种情况有木有? 提前声明: 本文并不讨论操作系统的比较, 以及 ...

  5. MySQL案例08:MySQL Scheduler Events带来的风险

    定时任务是我们开发.运维人员经常用到的,比如cron,job,schedule,events scheduler等都是为了方便我们重复执行某项工作而无需人工参与而设计,这里我要说的是MySQL数据库本 ...

  6. 微信小程序里解决app.js onLaunch事件与小程序页面的onLoad加载前后异常问题

    使用 Promise 解决小程序页面因为需要app.js onLaunch 参数导致的请求失败 app.js onLaunch 的代码 "use strict"; Object.d ...

  7. 实现CTreeCtrl父子节点的联动选择

    本文实现了下面的功能: 当选中父节点时, 其所有子节点全部选中. 当取消选中父节点时, 其所以子节点全部取消选中. 点击子节点时, 根据子节点与其兄弟节点的选中状态, 自动设置父节点的选中状态. 通过 ...

  8. Win7命令终端基础配色指南

    微软对控制台字体的元数据有严格的限制,https://support.microsoft.com/zh-cn/help/247815/necessary-criteria-for-fonts-to-b ...

  9. 第四次作业 重写equals方法

    使用上几次用到得User实体类,在其中重写equals方法. @Override public boolean equals(Object obj) { if(obj==null)return fal ...

  10. 最短路径Dijkstra matlab

    Dijkstra: function [dist,pre, full_path]=MinRoad_Dijkstra(G,v0) n=0; if isfield(G,'w') && ~i ...