jqgrid 表格插件实现多行表头

jqgrid

插件默认为2行

修改后可编程多行

修改jquery.jqGrid.src.js文件

if (skip === 0) {
   if (o.useColSpanStyle) {
 
// expand the header height to two rows 
      // $th.attr("rowspan", "2");
      //console.log($th);
      //console.log($th.parent());

      // expand the header height to many rows
      var rowspanlen = $th.parent().siblings('tr').length;
      //console.log("rowspanlen: " + rowspanlen);
      if(rowspanlen == 0){
         rowspanlen = 2;
      } else {
         rowspanlen++;
      }
      $th.attr("rowspan", rowspanlen);
   } else {
      $('<th>', {role: "columnheader"})
         .addClass("ui-state-default ui-th-column-header ui-th-"+ts.p.direction)
         .css({"display": cmi.hidden ? 'none' : '', 'border-top': '0 none'})
         .insertBefore($th);
      $tr.append(th);
   }
} else {

var groupHead = [];
$.each(areaobj,function(i,v){
    var sc = {
        startColumnName: v.id.trim()+'sampleCount',
        numberOfColumns: 6,
        titleText: v.planName.trim()
    };
    groupHead.push(sc);
});
$("#tabGrid").jqGrid('setGroupHeaders', {
    useColSpanStyle : true, // 没有表头的列是否与表头列位置的空单元格合并
    groupHeaders :  groupHead
});
groupHead = [];
$.each(areaobj,function(i,v){
    var sc = {
        startColumnName: v.id.trim()+'sampleCount',
        numberOfColumns: 6,
        titleText: v.projectName.trim()
    };
    groupHead.push(sc);
});
$("#tabGrid").jqGrid('setGroupHeaders', {
    useColSpanStyle : true, // 没有表头的列是否与表头列位置的空单元格合并
    groupHeaders :  groupHead
});

groupHead = [];
$.each(areaobj,function(i,v){
    var sc = {
        startColumnName: v.id.trim()+'sampleCount',
        numberOfColumns: 6,
        titleText: v.footTypeName.trim()
    };
    groupHead.push(sc);
});
$("#tabGrid").jqGrid('setGroupHeaders', {
    useColSpanStyle : true, // 没有表头的列是否与表头列位置的空单元格合并
    groupHeaders :  groupHead
});