Jqgrid搜索工具栏筛选唯一的下拉列表

Question

我使用了这篇文章中的例子，根据列数据在搜索工具栏中创建一个唯一的下拉列表非常有效。但是，如果我有多页数据，则下拉列表仅从第一页填充。我是jquery和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"});

Answer 1

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

Answer 2

您必须将列表发送到jqgrid之外的页面。如果您在ajax模式下使用jqgrid，它一次只拉一个页面，而不知道所有其他数据。

如果这只是使用上面的mydata的问题，并且数据都在js的范围内，但只是在另一个页面上（jqgrid上的结果集），为什么不构建列表并使用它来代替名为text的var呢。你只查看页面数据，而不是加载的所有数据。这有意义吗？