1. 程式人生 > >jqGrid列標題合併,一行顯示,(三列共用同一列名稱)

jqGrid列標題合併,一行顯示,(三列共用同一列名稱)


關鍵設定:

cmTemplate: {
        resizable:false,
        sortable: false
},

gridComplete: function() {

var $grid = $("#ID");

// 第一列的寬度 = 三列寬度總和

var newWidth = $("#kijituMeisaiGrid_startTimeH").width() +
          $("#kijituMeisaiGrid_semiMarkStart").outerWidth(true) +
          $("#kijituMeisaiGrid_startTimeM").outerWidth(true);
$grid.jqGrid("setLabel", "startTimeH", lblColStartTime, "", {
   style: "width: " + newWidth + "px;",
   colspan: "3"

});

// 第二,三列標題隱藏

$grid.jqGrid("setLabel", "semiMarkStart", "", "", {style: "display: none"});
$grid.jqGrid("setLabel", "startTimeM", "", "", {style: "display: none"});
newWidth = $("#kijituMeisaiGrid_endTimeH").width() +
       $("#kijituMeisaiGrid_semiMarkEnd").outerWidth(true) +
       $("#kijituMeisaiGrid_endTimeM").outerWidth(true);
$grid.jqGrid("setLabel", "endTimeH", lblColEndTime, "", {
   style: "width: " + newWidth + "px;",
   colspan: "3"
});
$grid.jqGrid("setLabel", "semiMarkEnd", "", "", {style: "display: none"});
$grid.jqGrid("setLabel", "endTimeM", "", "", {style: "display: none"});
}