加载中…
个人资料
  • 博客等级:
  • 博客积分:
  • 博客访问:
  • 关注人气:
  • 获赠金笔:0支
  • 赠出金笔:0支
  • 荣誉徽章:
正文 字体大小:

jqGrid表头锁列及排序功能细节

(2013-01-16 19:55:35)
标签:

it

java

jqgrid

frozen

杂谈

一、jqGrid添加列的大标题

如图所示:jqGrid表格中可以为任意几列添加共同的标题头部

 

 http://s11/mw690/a322cd8dnd36696e4558a&690

实现代码:

jQuery("#grid_id").jqGrid('setGroupHeaders', {//显示报表头部信息

            useColSpanStyle: false,

            groupHeaders:[

           {startColumnName: 'name', numberOfColumns:2, titleText: '个人基本信息'},

           {startColumnName: 'address', numberOfColumns: 1, titleText: '个人住址信息'}

            ]

           });  

属性解释:useColSpanStyle:此属性为false时,标题头会占一正行,没有表头则空着。为true时当为空时,下面的额列标题会占用,如下图:

 

{startColumnName: 'name', numberOfColumns:2, titleText:

'<个人基本信息'},

其中,startColumnName:表示开始的列名,numberOfColumns:规定从startColumnName开始往后的几列都共用一个大标题。titleText:表示大标题显示的名称

 http://s5/mw690/a322cd8dnd3669dbe89d4&690

 

 

二、jqGrid锁定列

只有在jqGrid4.1.2版本以上的jqGrid图表支持表的列锁定功能

1、主要效果,如图http://s14/mw690/a322cd8dnd3669f11462d&690

 

在拉动横向滚动条的时候前两列的内容样式不会变动,只有后面没有被锁定的列变动。

2、实现

 在jqGrid的colModel:属性中,有一个属性为frozen,当其为true时表示要锁定该列,默认为false。当需要是需要自己手工配置为true.注意:被锁定的列必须要是连续的。然后需要用jqGrid的'setFrozenColumns'方法进行应用。

代码:colModel: [  {name:'name',index:'name', sorttype: "string", ,frozen:true}]

jQuery("#grid_id").jqGrid('setFrozenColumns');

注意:使用列锁定的功能的时候,jqGridsortable属性必须要为false,否则无效

0

阅读 收藏 喜欢 打印举报/Report
  

新浪BLOG意见反馈留言板 欢迎批评指正

新浪简介 | About Sina | 广告服务 | 联系我们 | 招聘信息 | 网站律师 | SINA English | 产品答疑

新浪公司 版权所有