jqGrid過濾器工具欄的初始默認值

Question

我正在使用jqGrid的過濾器工具欄，我需要設置一個初始默認過濾器值到其中一個字段，以便只有狀態爲'打開'的行默認顯示，但用戶如果需要可以顯示閉合行。

目前，我有這樣的

setTimeout(function() {$('#gs_Status').val('Open');$("#eventsGrid")[0].triggerToolbar()},500);

的方法，但它會導致第二個請求是非常糟糕真的。

有誰知道如何做到這一點？

編輯：略偏多的研究告訴我，這恐怕是不可能:(

Answer 1

有你看在jqGrid的文檔維基Toolbar Searching和Add-On Grid Methods它看起來像您可以使用filterToolbar設置？過濾器，並triggerToolbar設置過濾器。我還沒有嘗試過這個自己，但你也許可以做到這一點在loadComplete，一旦數據被加載的網格。

這是否幫助？

Answer 2

有幾個步驟來做到這一點：

1. 通過列模型中的搜索選項
2. 阻止默認的表單數據加載過程的默認值
3. 觸發過濾器工具條加載數據時表已準備就緒

在更詳細一點：

設置網格數據類型到本地（這可防止初始數據負載），並設置爲搜​​索選項的默認值：

$("#mytable").jqGrid({ 
    datatype: "local", 
    colNames:['Keyword','Selected'], 
    colModel:[ 
    {name:'keyword', 
     sortable:true, 
     searchoptions: { defaultValue:'golf' } 
    }, 
    {name:'selected', 
     sortable:false, 
     searchoptions: { } 
    }, 
    .... 
    .... 

然後添加過濾器工具欄，設置數據類型和URL，並觸發負載：

$('#mytable').jqGrid('filterToolbar', {autosearch: true}); 
    $('#mytable').setGridParam({datatype: 'json', url:'/get_data.php'}); 
    $('#mytable')[0].triggerToolbar(); 

Answer 3

所有我讀，我沒有工作的提示。所以我嘗試了很多，並在jqGrid源代碼中做了一些研究。如果使用beforeRequest事件，則集成「默認值」或「保存的搜索值」功能會更容易。

我必須解決一些問題：

1. 雖然它的beforeRequest事件，設置有將無法使用，直到調用triggerToolbar搜索參數。
2. triggerToolbar不僅用新的搜索參數設置新的請求，而且還觸發表數據的重新加載 - 但前一個請求仍在運行，因此您可以兩次執行相同的請求（兩個都使用新的搜索參數） 。
3. 設置默認值，但允許用戶清除/覆蓋它們。
4. 避免無限循環並保持舊的搜索功能。

下面的代碼：

beforeRequest: function() 
{ 
    // Activate filter toolbar and define "beforeSearch" callback 
    // to avoid a second search request on page load, triggered 
    // by "triggerToolbar()" when not set. 
    // 
    // Important: 
    // "beforeSearch" has to return true to avoid the second 
    // request on page load, but it has to return false for all 
    // following searches (otherwise it wouldn't be possible to 
    // submit new searches by pressing Enter in search input fields). 
    $("#myTable").jqGrid('filterToolbar', { 
     beforeSearch: function(){ 
      if ($(this).data('firstSearchAbortedFlag') != '1') 
      { 
       $(this).data('firstSearchAbortedFlag', '1'); 
       return true; 
      } 

      // Return false or add your customizations here... 
      return false; 
     } 
    }); 

    if ($(this).data('defaultValuesSetFlag') != '1') 
    { 
     // Set flag to set default only the first time when 
     // the page is loaded. 
     $(this).data('defaultValuesSetFlag', '1'); 

     // Set default values... 
     // (id = 'gs_' + fieldname) 
     $('#gs_field_a').val('value a'); 
     $('#gs_field_b').val('value b'); 

     // Call "triggerToolbar" to use the previously set 
     // parameters for the current search. 
     // 
     // Important: 
     // Set "beforeSearch" callback for "filterToolbar" to avoid 
     // a second search request, triggered by "triggerToolbar". 
     $("#myTable")[0].triggerToolbar(); 
    } 
} 

我希望這可以幫助你！

Answer 4

我以不同的方式解決了上述問題，即濫用beforeRequest函數將初始默認值添加到發佈數據。

已與jqGrid的創建者聯繫，默認值選項僅用於高級搜索。

我寫了一個函數，您可以在onBeforeRequest函數上設置函數將抓取搜索選項中的所有默認值並將其附加到發佈數據。所以默認值會被添加到初始請求中。

爲確保您仍然可以使用onbeforeRequest事件，我在代碼末尾更改了onBeforeRequest（this.p.beforeRequest = function（）{}）。你可以將它改變成你想要的，並稱之爲。下一次你會做一個請求函數將被使用，這個函數將被解散（因爲重寫）。

function() { 

    var defaultSearchOptions = []; 
    var colModel = this.p.colModel; 

    // loop trough each column and check if they have an default value in search options 
    // and add them to the array 
    $.each(colModel, function (index, column) { 

     if (column.hasOwnProperty('searchoptions')) { 

      var searchOptions = column.searchoptions; 

      if (searchOptions.hasOwnProperty('defaultValue')) { 

       defaultSearchOptions[defaultSearchOptions.length++] = 
       { 
        ""field"": column.index, 
        ""op"": ""bw"", 
        ""data"": searchOptions.defaultValue 
       }; 
      } 
     } 
    }); 


    // if there are any default search options retrieve the post data 
    if (defaultSearchOptions.length > 0) { 

     var postData = this.p.postData; 

     var filters = {}; 

     // check if post data already has filters 
     if (postData.hasOwnProperty('filters')) { 
      filters = JSON.parse(postData.filters); 
     } 

     var rules = []; 

     // check if filtes already has rules 
     if (filters.hasOwnProperty('rules')) { 
      rules = filters.rules; 
     } 

     // loop trough each default search option and add the search option if the filter rule doesnt exists 
     $.each(defaultSearchOptions, function (defaultSearchOptionindex, defaultSearchOption) { 

      var ruleExists = false; 

      $.each(rules, function (index, rule) { 

       if (defaultSearchOption.field == rule.field) { 
        ruleExists = true; 
        return; 
       } 
      }); 

      if (ruleExists == false) { 
       rules.push(defaultSearchOption); 
      } 
     }); 

     filters.groupOp = 'AND'; 
     filters.rules = rules; 

     // set search = true 
     postData._search = true; 
     postData.filters = JSON.stringify(filters); 
    } 

    this.p.beforeRequest = function() { // your before request function here }; 
    this.p.beforeRequest.call(this); 
} 

希望這有助於

Answer 5

通過Ziege's answer看完後，我想到了發生了什麼事情在那裏。我想出了一個更簡單的方法，在第一個請求發送到服務器之前獲取初始化的默認值。

下面是一個完整的工作示例。這個想法是，有一個列過濾器的狀態下拉，「活躍」和「關閉」，我希望默認爲「活躍」。該代碼有註釋來解釋發生了什麼：

$('#deals').jqGrid({ 
    colNames: ['...','Status','...'], 
    colModel: [ 
     { ... }, 
     // Use the defaultValue attribute to set your defaults in the searchOptions object 
     { name: 'Status', stype: 'select', searchoptions: { defaultValue: 'Active', value: {"":"All","Active":"Active","Closed":"Closed",}, sopt: [ 'eq'] }, width: 60 }, 
     { ... } 
    ], 
    // Here's where we intercept each server request to cancel it if it's the first one. 
    // Returning false from this method causes the request to the server to be aborted. 
    beforeRequest: function() { 
     // Define a local reference to the grid 
     var $requestGrid = $(this); 
     // Check a data value for whether we've completed the setup. 
     // This should only resolve to true once, on the first run. 
     if ($requestGrid.data('areFiltersDefaulted') !== true) { 
      // Flip the status so this part never runs again 
      $requestGrid.data('areFiltersDefaulted', true); 
      // After a short timeout (after this function returns false!), now 
      // you can trigger the search 
      setTimeout(function() { $requestGrid[0].triggerToolbar(); }, 50); 
      // Abort the first request 
      return false; 
     } 
     // Subsequent runs are always allowed 
     return true; 
    }, 
    url: 'Url/to/your/action', 
    datatype: 'json', 
    mtype: 'POST', 
    pager: '#deals-pager', 
    rowNum: 15, 
    sortname: 'Status', 
    sortorder: 'desc', 
    viewrecords: true, 
    height: '100%' 
}).jqGrid('filterToolbar', { stringResult: true }); 

這也適用於Lib.Web.Mvc庫（.NET），它不支持local數據類型。

如果您有多個網格，或者希望將beforeRequest邏輯移動到共享庫，簡單地將其作爲一個獨立的功能，並在網格設置按名稱引用它：

function jqGridFilterSetupRequestHandler = function() { 
    var $requestGrid = $(this); 
    if ($requestGrid.data('areFiltersDefaulted') !== true) { 
     $requestGrid.data('areFiltersDefaulted', true); 
     setTimeout(function() { $requestGrid[0].triggerToolbar(); }, 50); 
     return false; 
    } 
    return true; 
} 

$('#deals').jqGrid({ 
    colNames: ['...','Status','...'], 
    colModel: [ 
     { ... }, 
     // Use the defaultValue attribute to set your defaults in the searchOptions object 
     { name: 'Status', stype: 'select', searchoptions: { defaultValue: 'Active', value: {"":"All","Active":"Active","Closed":"Closed",}, sopt: [ 'eq'] }, width: 60 }, 
     { ... } 
    ], 
    beforeRequest: jqGridFilterSetupRequestHandler, 
    url: 'Url/to/your/action', 
    datatype: 'json', 
    mtype: 'POST', 
    pager: '#deals-pager', 
    rowNum: 15, 
    sortname: 'Status', 
    sortorder: 'desc', 
    viewrecords: true, 
    height: '100%' 
}).jqGrid('filterToolbar', { stringResult: true });