我们可以在jqgrid中包含两个标头。一个是colModel而另一个没有colModel?
另外,我有一个问题,当我点击一行时,整个网格会突出显示。我该如何解决这个问题?
CSS代码:
.cssclass{
background-color : #EEEEEE;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #0B0B61;
border: 0;
font-weight: bold;
text-align: center;
text-indent: 2pt;
padding-top: 2px;
padding-right: 2px;
padding-left: 2px;
left: expression(parentNode.parentNode.parentNode.parentNode.parentNode.scrollLeft);
position:relative;
z-index:10;
cursor: default;
}
jqgrid代码:
$.ajax({
type: "POST",
url: 'cfcs/index.cfc?method=getCols',
data: "",
dataType: "json",
success: function(result)
{
colM = eval("([" + result.COLMODEL + "])");
colN = result.COLNAMES;
jQuery("#list").jqGrid({
url:'cfcs/index.cfc?method=getDetails',
datatype: 'json',
mtype: 'POST',
colNames:colN,
colModel :colM,
height: 'auto',
hoverrows: true,
width: 1260,
shrinkToFit: false,
pager: jQuery('#pager'),
resizable: false,
rowNum: 25,
rowList: [25, 50, 100],
viewrecords: true,
jsonReader: {
root: "ROWS", //our data
page: "PAGE", //current page
total: "TOTAL", //total pages
records:"RECORDS", //total records
cell: "",
id: "0"
}
//loadComplete: function(data){alert('loaded');},
//loadError: function(xhr,status,error){alert('error');}
})
$("#list").setLabel("col1","<br><br>col1","cssclass");
$("#list").setLabel("col2","<br><br>col1","cssClass");
$("#list").jqGrid('navGrid','#pager',{
edit:false,
add:false,
del:false,
search:true,
refresh: true,
searchtext:"Search",
refreshtext: "Refresh",
'cloneToTop':true
});
},
error: function(x, e)
{
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});
感谢。
答案 0 :(得分:1)
关于你的第二个问题。我认为你对所有网格行使用相同的id。行id必须是唯一的,那么你就不会有这个问题。
关于两个标题我真的不明白你的意思。可以说你可以解释你的意思或者张贴图片。
答案 1 :(得分:0)
您可以考虑为每个日期范围使用单独的网格,并将它们格式化为看起来像是在一起。
---------------------------------------------------
| 1/1/2010 | 1/2/2010 |
---------------------------------------------------
| grid 1 header | grid 2 header |
---------------------------------------------------
您可以将grid1和grid2的各种事件绑定在一起,因此选择grid1中的第10行也会在grid2中选择它。
您可能还想查看“高级”下的subgrid demos here,看看是否有适用于您的数据的内容。
<强>替代强>
在阅读了您的评论后,我认为这可能更接近您想要的,只需更改日期范围的单位。
.ui-jqgrid .ui-jqgrid-htable th div
{
height: auto;
padding: 5px 0px;
}