如何在頁面重新加載時保留jqGrid中的搜索過濾器？

Question

我發現很多與我需要的討論很接近，而這個問題最接近 - How can I set postData._search to true in the request in jqGrid?。

因爲我幾乎面臨同樣的問題，只是無法讓它工作 - 我想在jqGrid的初始加載過程中設置「搜索」和「過濾器」 - 比如在頁面重新加載時，並且我在會話中存儲了我的過濾器 - 並且嘗試了我在Oleg的示例中找到的所有內容 - 它不起作用！

這就是我想要做的事 -

loadBeforeSend: function (xhr) { 
    var grid = jQuery('#' + block_id); 
    var postData = grid.jqGrid('getGridParam','postData'); 
    jQuery.extend(postData,{filters:MyFilters}); 
    grid.jqGrid('setGridParam', {search: true, postData: postData}); 
    console.log(grid.jqGrid('getGridParam','postData')); 
} 

控制檯打印輸出顯示過濾器已經到位，但_search還是假的，實際的帖子被甚至沒有任何過濾器發送：

_search false 
block_id report_block_1table 
nd  1297451574526 
page  1 
rows  25 
sidx  id 
sord  desc 

但是，如果我把完全相同的代碼 - 通過添加

grid.trigger("reloadGrid"); 

行 - 進入某個按鈕的onClickButton函數，然後點擊按鈕 - 一切正常;但我需要使它在「頁面重新加載」上工作！

任何想法？這讓我發瘋......

Answer 1

在我看來，你不是第一個問同樣問題的人。最近我詢問了the close question（讀了很多評論的答案）。另一個old answer包括the demo可能會回答你的一些問題。

使用beforeRequest不工作，只是因爲功能beforeRequest將Ajax調用和search參數的變化之前立即caled你的代碼是太晚。此外，每次都可能不是最好的想法。在用戶不能設置任何其他電網濾波器的情況下。

所以我可以重複一遍，您需要的解決方案的實施非常簡單。您只需將jqGrid的postData參數的filters屬性設置爲您需要的過濾器，並另外設置另一個jqGrid參數search:true。就這些！稍後，用戶將能夠打開高級搜索對話框並覆蓋過濾器。用戶也可以點擊預先搜索對話框中的「重置」按鈕，並將filters設置爲空字符串，search:false。

爲了更好地理解，我必須清楚如何在URL中使用search參數或其他jqGrid。 jqGrid的參數prmNames定義了參數名稱作爲URL的一部分發送或作爲發送到服務器的數據的一部分。的prmNames含有search:"_search"默認值和通過的jqGrid使用的內部populate函數的代碼具有以下簡化的代碼片段：

var prm = {}, pN=ts.p.prmNames; 
if(pN.search !== null) {prm[pN.search] = ts.p.search;} 
if(pN.nd !== null) {prm[pN.nd] = new Date().getTime();} 
if(pN.rows !== null) {prm[pN.rows]= ts.p.rowNum;} 
if(pN.page !== null) {prm[pN.page]= ts.p.page;} 
if(pN.sort !== null) {prm[pN.sort]= ts.p.sortname;} 
if(pN.order !== null) {prm[pN.order]= ts.p.sortorder;} 
... 
$.extend(ts.p.postData,prm); 

其中

prmNames: {page:"page",rows:"rows", sort: "sidx",order: "sord", search:"_search", 
      nd:"nd", id:"id",oper:"oper",editoper:"edit",addoper:"add", 
      deloper:"del", subgridid:"id", npage: null, totalrows:"totalrows"} 

所以設置_search參數URL中的一個應該設置search jqGrid的參數。

看看the following demo。你可以很容易檢驗使用的Firebug從頁面的jqGrid發送HTTP GET與以下網址Fiddler：

http://www.ok-soft-gmbh.com/jqGrid/MultisearchFilterAtStart1.json?filters=%7B%22groupOp%22%3A%22AND%22%2C%22rules%22%3A%5B%7B%22field%22%3A%22invdate%22%2C%22op%22%3A%22gt%22%2C%22data%22%3A%222007-09-06%22%7D%2C%7B%22field%22%3A%22invdate%22%2C%22op%22%3A%22lt%22%2C%22data%22%3A%222007-10-04%22%7D%2C%7B%22field%22%3A%22name%22%2C%22op%22%3A%22bw%22%2C%22data%22%3A%22test%22%7D%5D%7D&_search=true&nd=1297508504770&rows=10&page=1&sidx=id&sord=asc 

所以它做的正是你需要的。演示代碼包含以下代碼片段：

$("#list").jqGrid({ 
    url: 'MultisearchFilterAtStart1.json', 
    datatype: "json", 
    postData: { 
     filters:'{"groupOp":"AND","rules":['+ 
       '{"field":"invdate","op":"gt","data":"2007-09-06"}'+ 
       ',{"field":"invdate","op":"lt","data":"2007-10-04"}'+ 
       ',{"field":"name","op":"bw","data":"test"}]}' 
    }, 
    search:true, 
    // ... 
}); 

Answer 2

@ Oleg Oleg的答案像魅力一樣，但僅僅是第一次。

對我來說，當我重新加載網格時，過濾器和搜索標誌沒有設置。 每次我重新加載網格時，下面的代碼也會發送過濾器和搜索標誌。 我使用服務器端排序和分頁。

我使用：

jQuery("#myGrid").navGrid("#myPager", {search: true, refresh: true, edit: false, 
    add:false, del:false}, {}, {}, {}, {}); 

在網格的定義：

beforeRequest: function() { 
    // filter to be added on each request 
    var filterObj1 = {"field":"myField","op":"eq","data":"myValue"}; 
    var grid = jQuery("#myGrid"); 
    var postdata = grid.jqGrid('getGridParam', 'postData');    
    if(postdata != undefined && postdata.filters != undefined) { 
     postdata.filters = jQuery.jgrid.parse(postdata.filters); 
     //Remove if current field exists 
     postdata.filters.rules = jQuery.grep(postdata.filters.rules, function(value) { 
      if(value.field != 'myField') 
       return value; 
     }); 
     // Add new filters 
     postdata.filters.rules.push(filterObj1); 
    } else { 
     jQuery.extend(postdata, { 
      filters: { 
       "groupOp":"AND", 
       "rules":[filterObj1] 
      } 
     }); 
     // more filters in the way: postdata.filters.rules.push(filterObj1); 
    } 
    postdata.filters = JSON.stringify(postdata.filters); 
    postdata._search = true; 
    return [true,'']; 
}