Jqgrid搜索工具欄過濾器獨特的下拉列表

我已經使用了this post中的示例，它非常適合在基於列數據的搜索工具欄中創建唯一的下拉列表。但是，如果我有多頁數據，則只會從第一頁填充下拉列表。我是jquery和jqgrid的新手，一直無法找到解決方案。有任何想法嗎？Jqgrid搜索工具欄過濾器獨特的下拉列表

謝謝。

這裏是從上面鏈接的帖子複製的代碼。

var mydata = [ 
    {id:"1", Name:"Miroslav Klose",  Category:"sport", Subcategory:"football"}, 
    {id:"2", Name:"Michael Schumacher", Category:"sport", Subcategory:"formula 1"}, 
    {id:"3", Name:"Albert Einstein", Category:"science", Subcategory:"physics"}, 
    {id:"4", Name:"Blaise Pascal",  Category:"science", Subcategory:"mathematics"} 
], 
grid = $("#list"), 
getUniqueNames = function(columnName) { 
    var texts = grid.jqGrid('getCol',columnName), uniqueTexts = [], 
     textsLength = texts.length, text, textsMap = {}, i; 
    for (i=0;i<textsLength;i++) { 
     text = texts[i]; 
     if (text !== undefined && textsMap[text] === undefined) { 
      // to test whether the texts is unique we place it in the map. 
      textsMap[text] = true; 
      uniqueTexts.push(text); 
     } 
    } 
    return uniqueTexts; 
}, 
buildSearchSelect = function(uniqueNames) { 
    var values=":All"; 
    $.each (uniqueNames, function() { 
     values += ";" + this + ":" + this; 
    }); 
    return values; 
}, 
setSearchSelect = function(columnName) { 
    grid.jqGrid('setColProp', columnName, 
       { 
        stype: 'select', 
        searchoptions: { 
         value:buildSearchSelect(getUniqueNames(columnName)), 
         sopt:['eq'] 
        } 
       } 
    ); 
}; 
grid.jqGrid({ 
    data: mydata, 
    datatype: 'local', 
    colModel: [ 
     { name:'Name', index:'Name', width:200 }, 
     { name:'Category', index:'Category', width:200 }, 
     { name:'Subcategory', index:'Subcategory', width:200 } 
    ], 
    sortname: 'Name', 
    viewrecords: true, 
    rownumbers: true, 
    sortorder: "desc", 
    ignoreCase: true, 
    pager: '#pager', 
    height: "auto", 
    caption: "How to use filterToolbar better locally" 
}).jqGrid('navGrid','#pager', 
      {edit:false, add:false, del:false, search:false, refresh:false}); 

setSearchSelect('Category'); 
setSearchSelect('Subcategory'); 

grid.jqGrid('setColProp', 'Name', 
      { 
       searchoptions: { 
        sopt:['cn'], 
        dataInit: function(elem) { 
         $(elem).autocomplete({ 
          source:getUniqueNames('Name'), 
          delay:0, 
          minLength:0 
         }); 
        } 
       } 
      }); 

grid.jqGrid('filterToolbar', 
      {stringResult:true, searchOnEnter:true, defaultSearch:"cn"});

來源

2011-06-16 kes9

如果您使用datatype: 'local'您在mydata已獲得您需要的信息。或者，您可以使用var gridData = grid[0].p.data或與var gridData = grid.jqGrid('getGridParam','data')相同的網格包含所有網格頁面。因此，您可以使用gridData.length和gridData[columnName]或String(gridData[columnName])代替textsLength和texts[i]在getUniqueNames函數中。

來源

2011-06-16 21:28:32 Oleg

感謝Oleg，這聽起來像是朝着正確方向邁出的一步。但是，我不確定如何將這些更改應用到上面的代碼以使其工作。再次，我對Jqgrid和Javascript真的很陌生，有很多東西需要學習。所以，如果你不介意你能告訴我更改代碼的地方嗎？再次感謝。 – kes9 2011-06-20 16:15:44

@ kes9：這並不難。我會在稍後爲你準備的（我剛剛從客戶手中拿回來，然後在家裏做些事情:-)）。 – Oleg 2011-06-20 17:51:12

沒問題。謝謝。 – kes9 2011-06-20 18:21:41

您必須將列表發送到jqgrid之外的頁面。 jqgrid一次只能拉一個頁面，並且不知道所有其他數據，如果你在ajax模式下使用它。

如果這只是使用上面的mydata，並且數據全部在js範圍內，而只是在另一個頁面上（jqgrid上的結果集），爲什麼不建立列表並使用它var的位置稱爲文本。您只會瀏覽頁面數據，而不是您加載的所有數據。這是否有意義？

來源

2011-06-16 20:00:19 CrazyDart

Jqgrid搜索工具欄過濾器獨特的下拉列表

回答

相關問題