jqGrid和搜索過濾器。重新填充數據的最佳方法

Question

我一直在玩jqGrid相當長的時間，但從未深入過關於性能的細節。
我不使用內置的jqGrid搜索表單，因爲我更喜歡有我自己的工具欄，用戶可以在其中輸入一些他/她想要過濾的數據。

我一直包裹着我的網格功能：

$(document).ready(function() { 

    var myGrid = jQuery("#MyGrid"); 

    $("#cmdSearch").bind('click', function (e) { 
     myGrid.GridUnload(); 
     LoadMyGrid($("#Filter1").val(), $("#Filter2").val()) 
    }); 

    function LoadMyGrid(param1, param2) { 
     myGrid.jqGrid({ 
      url: 'myUrl', 
      postData: { Param1: param1, Param2: param2 }, 
      datatype: 'json', 
      mtype: 'POST', 
      colNames: ['Column1', 'Column2'], 
      colModel: [ 
         { name: 'colum1', index: 'colum1', sortable: true, width: 100 }, 
         { name: 'colum2', index: 'colum2', sortable: true, width: 100 } 
         ], 
      pager: $('#MyPager'), 
      rowList: [10, 50, 100], 
      rowNum: 10, 
      viewrecords: false, 
      shrinkToFit: false, 
      rownumbers: true, 
      hidegrid: false, 
      emptyrecords: "No records." 
     }); 
    } 
}); 

並重新創建它之前把它卸載了（GridUnload）。我想知道這是否是最好的方式，或者可能存在一些性能/內存問題？

Answer 1

在示例中使用GridUnload()並不是最好的方法。如下

$(document).ready(function() { 
    var myGrid = jQuery("#MyGrid"); 

    myGrid.jqGrid({ 
     url: 'myUrl', 
     postData: { 
      Param1: function() { return $("#Filter1").val(); }, 
      Param2: function() { return $("#Filter2").val(); } 
     }, 
     datatype: 'json', 
     mtype: 'POST', 
     colNames: ['Column1', 'Column2'], 
     colModel: [ 
      { name: 'colum1', index: 'colum1', sortable: true, width: 100 }, 
      { name: 'colum2', index: 'colum2', sortable: true, width: 100 } 
     ], 
     pager: '#MyPager', 
     rowList: [10, 50, 100], 
     rowNum: 10, 
     viewrecords: false, 
     shrinkToFit: false, 
     rownumbers: true, 
     hidegrid: false, 
     emptyrecords: "No records." 
    }); 

    $("#cmdSearch").click(function() { 
     myGrid.trigger('reloadGrid',[{page:1}]); 
    }); 
}); 

在我使用的使用功能的想法，這是我所描述here的postData屬性的代碼，我會重寫你的代碼。可以將「點擊」處理減少到myGrid.trigger('reloadGrid');。在所有網格重新加載（例如在分類或分頁）的情況下將使用來自$("#Filter1")和$("#Filter2")控件的當前值。網格本身不會被破壞和重新創建。而不是隻有網格數據纔會被重新加載。關於reloadGrid的不同附加參數，請參閱here。

從pager: $('#MyPager')到pager: '#MyPager'的小改動我想要一點點評論。如果你看一下the jqGrid source code你會發現

if(typeof ts.p.pager == "string") {if(ts.p.pager.substr(0,1) !="#") { 
    ts.p.pager = "#"+ts.p.pager;} 
} else { ts.p.pager = "#"+ $(ts.p.pager).attr("id");} 

所以如果你使用pager參數的形式$('#MyPager')如果將「正常化」到「#MyPager」。閱讀完本文後，我只使用pager: '#MyPager'語法。