有时,我们需要给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. 数组无法使用 forEach() 方法 - 分号的重要性

    问题描述: 函数的结构如上图所示,在调用该函数的时候,浏览器报错: 分析原因: 在 js 的语法中,如果语句独占一行,通常可以省略句末的分号 但实际上 js 解析代码的时候,只有在句末缺少分号就无法正 ...

  2. vue-router重定向 不刷新问题

    前阵子太忙了,自己一个人一边开发着新项目,一边维护着旧项目,没时间写博客,终于让我腾出时间了.废话少说,开始正文. 问题描述: 之前项目是angular开发的,后来用vue重构后.项目路径和vue路径 ...

  3. 【代码笔记】iOS-计算时间差

    一,代码. - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view, ...

  4. mysql数据库操作指令

    数据库相关 查询所有数据库 show databases; 创建数据库 create database 数据库名: 创建数据库指定字符集 create database 数据库名 character ...

  5. AngularJS学习之 angular-file-upload控件使用方法

    1.官方链接 https://github.com/nervgh/angular-file-upload 2.安装到项目中 bower install angular-file-upload(安装完成 ...

  6. C#版Aliyun DNS API

    阿里云解析API,是为域名开发者.注册商.域名代理商等提供的开放和便捷的解析服务接口.API依托于万网云解析服务,可以方便的管理域名和解析记录,让你的解析管理变的随心省时自由舒畅. 一.先附上Aliy ...

  7. npm 安装指定模块版本

    npm list  查看具体模块 如: npm list @antv/g6 如需要安装指定的模块和版本 保存时      - --save-dev 是你开发时候依赖的东西,--save 是你发布之后还 ...

  8. Everything实用技巧随手记

    Everything是一款非常好用的即时搜索软件,针对文件名目录名搜索,并且支持通配符.正则表达式,胜过windows自带搜索N倍. 在使用中有些许不便,比如搜索结果中出现很多快捷方式,或者搜索到不想 ...

  9. smarty详细使用教程(韩顺平smarty模板技术笔记)

    MVC是一种开发模式,强调数据的输入.处理.显示是强制分离的 Smarty使用教程1.如何配置我们的smarty解压后把libs文件夹放在网站第一级目录下,然后创建两个文件夹templates 存放模 ...

  10. C语言的历史及个人拙见

    C语言是一个无限广阔的世界,你刚开始睁眼看它的时候以为视线的尽头就是边界,但当你慢慢走去,才发现天外有天.这或许就是江湖传说只有C才有真正高手的原因,或许我们也可以反过来说:C没有高手——因为没有人能 ...