扫描二维码用手机看文章$(function(){
$.topuiRender();
$(&#GridId&).setGroupHeaders({
useColSpanStyle: true,
//表头是否合并行
groupHeaders:[
{startColumnName: 'ColumnName1', numberOfColumns: 1, titleText: '二级表头1 '},
{startColumnName: 'ColumnName2', numberOfColumns: 1, titleText: '二级表头2'},
{startColumnName: 'ColumnName3', numberOfColumns: 1, titleText: '二级表头3'},
{startColumnName: 'ColumnName4', numberOfColumns: 2, titleText: '二级表头4'}
jQuery(&#jydldlhsGrid&).jqGrid(&setComplexGroupHeaders&,{
complexGroupHeaders:[
{startColumnName: 'ColumnName5', numberOfColumns: 21, titleText: ' 三级表头1'},
{startColumnName: 'ColumnName6', numberOfColumns: 5, titleText: '三级表头2'},
{startColumnName: 'ColumnName7', numberOfColumns: 11, titleText: ' '},//不设值需要给个空字符串
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：1911次
排名：千里之外
原创：34篇
(3)(2)(7)(2)(6)(18)君，已阅读到文档的结尾了呢~~
jqgrid合并表头jqgr
扫扫二维码，随身浏览文档
手机或平板扫扫即可继续访问
jqgrid合并表头
举报该文档为侵权文档。
举报该文档含有违规或不良信息。
反馈该文档无法正常浏览。
举报该文档为重复文档。
推荐理由：
将文档分享至：
分享完整地址
文档地址：
粘贴到BBS或博客
flash地址：
支持嵌入FLASH地址的网站使用
html代码：
&embed src='/DocinViewer-4.swf' width='100%' height='600' type=application/x-shockwave-flash ALLOWFULLSCREEN='true' ALLOWSCRIPTACCESS='always'&&/embed&
450px*300px480px*400px650px*490px
支持嵌入HTML代码的网站使用
您的内容已经提交成功
您所提交的内容需要审核后才能发布，请您等待！
3秒自动关闭窗口jqgrid表头合并和行合并,基于jquery脚本插件_百度文库
两大类热门资源免费畅读
续费一年阅读会员，立省24元！
jqgrid表头合并和行合并,基于jquery脚本插件
上传于||暂无简介
阅读已结束，如果下载本文需要使用0下载券
想免费下载更多文档？
下载文档到电脑，查找使用更方便
还剩3页未读，继续阅读
你可能喜欢1.隐藏头多选checkboxvar myGrid = $(&#list&);$(&#cb_&+myGrid[0].id).hide();& 列表中checkbox隐藏为multiselect: false2.表头capiton 设置为&caption:&流水账&或者$('#XXX').setCaption(&XXX& );设置caption居中为&$('#XXX').closest(&div.ui-jqgrid-view&)& & & & & & & &.children(&div.ui-jqgrid-titlebar&)& & & & & & & &.css(&text-align&, &center&)& & & & & & & &.children(&span.ui-jqgrid-title&)& & & & & & & & .css(&float&, &none&);3.其余小技巧为1. 初始化的时候不加载数据设置datatype: 'local'1 $(&#grid&).jqGrid({2 url:&&,3 datatype:&local&,4 //other options5 });2. 当要加载数据的时候把datatype改成json或者XML:1 $(&#list&).jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');3.如果不要jqgrid表头上的点击排序可以把对应的colModel中加属性sortable : false.4.如果要给pager上的按钮加id(这样可以动态的hide,show此按钮)具体的方法就是jQuery(&#list&).jqGrid('navButtonAdd', '#pager', {caption : &导出&,title : &Excel&,position : &first&,id :'storeExp',buttonicon :'ui-icon-calculator',onClickButton : function (){}});5.如果要想显示jqgrid中的caption可以在css样式中加入如下(你可以发现.ui-jqgrid .ui-jqgrid-titlebar 的div块display是none,所以没显示)1 .ui-jqgrid .ui-jqgrid-titlebar2 {3 display:4 }6.如果要使用jqgrid中caption中文字居中显示1 gridComplete: function(){2
$('#list').closest(&div.ui-jqgrid-view&)3
.children(&div.ui-jqgrid-titlebar&)4
.css(&text-align&, &center&)5
.children(&span.ui-jqgrid-title&)6
.css(&float&, &none&);7
}7.当浏览器的大小改变时,jqgrid的宽度作为相应的改变1 gridComplete: function(){2
$(window).resize(function(){ 3
var winwidth=$(window).width()*0.5; //这里的0.5可以自己定4
$(&#list&).setGridWidth(winwidth);5
}8.在jqgrid后给每一行加超链接如下图所示代码描述如下: 1 jqGridAdapter(&#an&); 2
jQuery(&#an&).jqGrid({ 3
url : '../ListServlet?className=announcement', 4
datatype : &json&, 5
colNames : ['ID', '公告标题', '更新时间', '覆盖区域','操作'], 6
colModel : [{ 7
name : 'ID', 8
index : 'ID', 9
hidden : true,10
width : '55px'11
name : 'ANNOUNCEMENT_TITLE',13
index : 'ANNOUNCEMENT_TITLE',14
width : '100px',15
align : 'left',16
sortable:false17
name : 'UPDATE_DATE',19
index : 'UPDATE_DATE',20
width : '100px',21
align: 'left',22
formatter:'date',23
formatoptions:{srcformat:'Y-m-d H:i',newformat:'Y-m-d'},24
sortable:false25
name : 'ANNOUNCEMENT_REGION',27
index : 'ANNOUNCEMENT_REGION',28
width : '100px',29
align: 'center',30
sortable:false31
name : 'LOOK',33
index : 'LOOK',34
width : '50px',35
align: 'center',36
sortable:false37
rowNum :15,40
rowList : [15, 25, 30,50,100],41
pager : '#an_pager',42
viewrecords : true,43
sortname : 'update_date',44
autowidth:true,45
sortorder : &desc&,46
caption : &ca&,47
multiselect : false,48
rownumbers : true,49
jsonReader : {50
id : 'ID',51
repeatitems : false52
gridComplete:function()54
{55 　　　　　　　var ids=jQuery(&#an&).jqGrid('getDataIDs');56
for(var i=0; i&ids. i++){57
var id=ids[i];
focusNum = &&a href='#' style='color:#f60' alt='点击查看详细' onclick='showannouncement(& + id + &)'&查看&/a&&;59
jQuery(&#an&).jqGrid('setRowData', ids[i], { LOOK: focusNum});61
}62　　　　 },63
height : 'auto'64
});&&&&9.单元格内的文本自动换行&：加入样式：.ui-jqgrid tr.jqgrow td {white-space: normal !height:vertical-align:text-padding-top:2}colModel : [{ name :&'CommentID',index :'CommentID',sorttype :&int&,2formatter: cLink,width : 60}],3//其中的cLink就是自定义函数名4function&cLink(cellvalue, options, rowObject){5return&'&a href='&#mentID+'&编辑&/a&';6}&&10.获取列宽改变后的列宽值，用于保存移动后的列宽var test = $('#list2').jqGrid('getColProp', 'Name');&&&&&&& alert(test.width);&9.jqgrid关于日期格式化在colModel中添加1 formatter:'date',2 formatoptions:{srcformat:'Y-m-d H:i',newformat:'Y-m-d'}
无相关信息