1. 程式人生 > >標記jqgrid遇到問題 假分頁 合併單元格。

標記jqgrid遇到問題 假分頁 合併單元格。

1.假分頁

  jqgrid用來載入分頁體驗是很好,但是有時候我們需要假分頁。 

解決方式: 在jqgrid配置中新增 loadonce : true屬性,資料一次性全部返回即可。

2、隱藏顯示列

                $("#jqGrid").setGridParam().showCol("name"); jqGrid 容器id name:列名。                 $("#jqGrid").setGridParam().hideCol("name");

3、設定左右上下滾動條。

  解決方式: 在jqgrid配置中新增 scroll:true,

            //隱藏grid底部滾動條             $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 

           //顯示上下滾動條(固定表頭)             $("#jqGrid").closest(".ui-jqgrid-bdiv").css({ 'overflow-y' : 'scroll' });

4、新增單元格樣式

解決方式:  在colmodel中新增cellattr函式,可以通過此方式設定單元格樣式和合並單元格

例子: 新增樣式: { label: '練習次數', name: 'currentMonthData.count',width:80,cellattr: addCellAttr},

function addCellAttr(rowId, val, rawObject, cm, rdata) {
     if (val.indexOf("0") == 0) {
         return "style='color:red'";
      }
    }

  合併單元格: 百度一下有很多,遇到問題歡迎諮詢。

5、設定兩列表頭。

    grid.jqGrid('setGroupHeaders', {
        useColSpanStyle: false, 
        groupHeaders:[
            {startColumnName: 'centerName', numberOfColumns: 3, titleText: '<em>合併前三列</em>'},         
            {startColumnName: 'currentMonthData.count', numberOfColumns: 3, titleText: '<em>'+((new Date).getMonth()+1)+'當前月</em>'},
            {startColumnName: 'oneMonthBeforeData.count', numberOfColumns: 3, titleText: '<em>'+(new Date).getMonth()+'上個月</em>'},
            {startColumnName: 'twoMonthBeforeData.count', numberOfColumns: 3, titleText: '<em>'+((new Date).getMonth()-1)+'前月</em>'}
        ]  
      });