jqGrid用戶數據的自定義格式化程序

Question

是否有任何解決方法可以在jqGrid中將自定義「格式化程序」添加到userData？我發現this的問題，它幫助我很多。下面是我用來填充jqGrid的代碼。請注意，我在jsonReader中填充了一個自定義的userData對象，並將其設置爲loadComplete中的網格，我需要爲總列添加單獨的「格式化程序」。請讓我知道是否有辦法。提前致謝。

var userDataTotals; 
jq("#testGrid").jqGrid({ 
    url:'local', 
    datatype: 'local', 
    mtype: 'GET', 
    colNames:[ 
       'rowId','unitId', 
       '<fmt:message key="report.col1"/>', 
       '<fmt:message key="report.col2"/>', 
    ], 
    colModel :[ 
     {name:'rowId', index:'rowId',hidden: true,sortable: true,key:true}, 
     {name:'unitId', index:'unitId',hidden: true,sortable: true,key:true}, 
     {name:'outboundReadyDate', index:'outboundReadyDate', width:80,align:"center",sorttype:'integer',formatter:dateOnlyFmatter,datefmt:'Y M d'}, 
     {name:'outboundDate', index:'outboundDate', width:80,align:"center",sorttype:'integer',formatter:dateOnlyFmatter,datefmt:'Y M d'}, 
    ], 
    // this will enable the footer row to display totals 
    footerrow : true, 
    //userDataOnFooter : true, 
    altRows : true, 
    //to hide pager buttons 
    pgbuttons:false, 
    recordtext:'', 
    pgtext:'', 
    gridview: true, 
    height:270, 
    loadonce: true, 
    sortname: 'rowId', 
    sortorder: 'asc', 
    viewrecords: true, 
    rowNum:30000, 
    loadComplete: function() { 
     // This will increase the column header height (to show two rows in the header) 
     jq(".ui-jqgrid-sortable").css('white-space', 'normal'); 
     jq(".ui-jqgrid-sortable").css('height', 'auto'); 
     //Set the total values after load complete,otherwise 
     // custom formatter will format the total value as well. 

     jq("#mainReportGrid").jqGrid("footerData","set",userDataTotals,false); 

     //check the data type to avoid this code to execute when the pageload 
     var checkDatatype = myGrid.jqGrid("getGridParam","datatype"); 
     if(checkDatatype =='json' && myGrid.getGridParam('records') == 0){ 
      // when no records are displaying alert it to the user 
      alert(noRecordsMsg); 
     } 

    }, 

    jsonReader : { 
     root: "dtos", 
     records: "records", 
     repeatitems: false, 
     cell: "cell", 
     id: "rowId", 
     userdata :function(obj) { 
      userDataTotals = {"outboundReadyDate":obj.totalOutBounded, 
       "outboundDate":obj.totalOutBoundReady}; 
     } 

    }, 


    //This will format the date of the grid (without displaying time) 
    function dateOnlyFmatter (cellvalue, options, rowObject){ 
     var opts = options.colModel.formatoptions; 
     if(cellvalue==null || cellvalue=='undefined'){ 
      return '-'; 
     }else{ 
      if(opts != undefined && rowObject.projectTypeName =='IOD'){ 
       return 'N/A'; 
      } 
      var now = new Date(cellvalue); 
      return now.format('M j, Y'); 
     } 
    } 

我使用自定義dateFormat.js來格式化日期。

和JSON響應是 -

{ 
    "dtos": [ 
     { 
      "unitId": 1068, 
      "outboundDate": null, 
      "outboundReadyDate": 1317619303000, 
      "rowId": 13, 
     }, 
     { 
      "unitId": 1105, 
      "outboundDate": 1317616970000, 
      "outboundReadyDate": 1317617213000, 
      "rowId": 14, 
     } 
    ], 
    "totalOutBounded": 0, 
    "totalOutBoundReady": 4, 
    "rowTotal": 15, 
    "returnCode": 0, 
    "msg": "" 
} 

我用sortType作爲integer因爲從服務器我正在直接傳遞的Java「Date對象到電網。爲了整理它，我需要設置sortType到integer

基本問題是我在IE8我看不到'userData'總值。但在其他瀏覽器中，我可以看到它。我需要將userData的總值設置爲「超鏈接」。

沒有userData格式我可以看到在IE8中的總數。所以我在想，不使用列'formatter'添加一個自定義格式化程序的總值（userData）。

Answer 1

你有很多小的語法錯誤：

• 尾隨逗號的使用（如「}」）是一個語法錯誤。您必須從JSON數據和colNames和colModel中刪除尾隨逗號。無法讀取"rowId": 13,}和"rowId": 14,}。
• 您定義了jQuery("#testGrid")，但使用jQuery("#mainReportGrid")來設置頁腳。
• url: 'local'或任何其他url參數在datatype: 'local'的情況下沒有意義。在datatype: 'local'的情況下，url參數將被忽略（未使用）。
• 您使用myGrid，您未在發佈的代碼中定義。您應該在代碼的開頭某處定義var myGrid = jQuery("#testGrid");，或者在loadComplete事件處理程序的開頭定義var myGrid = $(this);。
• 您使用now.format('M j, Y')而不是發佈Date的擴展方法format。您可以改用jqGrid方法：return $.fmatter.util.DateFormat(undefined, now, 'M j, Y', $.jgrid.formatter.date);。
• 我建議你總是使用嚴格的等於===而不是==和!==而不是!=。請閱讀here以獲取更多信息。
• 我建議你使用height: 'auto'或scrollOffset: 0如果你使用jqGrid 沒有有滾動條。

• 我建議您閱讀the answer。如果使用所描述的錯誤修復可以修改線jq("#mainReportGrid").jqGrid("footerData","set",userDataTotals,false);到行

  myGrid.jqGrid("footerData", "set", myGrid.jqGrid('getGridParam', 'userData'), false);

  可變userDataTotals將不需要從userdata方法userdata可以被定義爲

  userdata: function (obj) { return { outboundReadyDate: obj.totalOutBounded, outboundDate: obj.totalOutBoundReady }; }

您可以看到here修改版本的代碼。