本地数据类型的Jqgrid搜索选项不起作用

时间:2014-01-02 18:36:36

标签: javascript ajax jquery jqgrid

我想为我的jqgrid表添加搜索选项

$('#jqgrid').jqGrid({
    datatype: 'local',
    data: mydata,
    caption: 'Titlepage Parameters',
    gridview: true,
    height: 'auto',
    colNames: ['title', 'color', 'fontsize'],
    colModel: [
        {name: 'config.titlepage.title' },
        {name: 'config.titlepage.color' },
        {name: 'config.titlepage.fontsize' },
    ],
    pager: '#pageGrid'
    localReader: {
        id: "_id.$oid"
    }
});
$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

我正在获取搜索选项,但是当我输入搜索字符串并单击“过滤器”按钮时,搜索正在进行。

请在这里帮助我,是否需要添加任何要为此搜索过滤器执行的库文件?

1 个答案:

答案 0 :(得分:2)

我不确定搜索你有哪些问题。唯一明显的错误是:您在{}列表中跳过一个navGrid。您当前的navGrid选项将删除选项设置为搜索选项。正确的选项是

$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

此外,您可以考虑向网格添加ignoreCase: true选项,以使搜索不区分大小写。 The demo似乎工作正常。

您可以使用另一个选项来读取相同的数据:使用datatype: 'jsonstring'。在这种情况下,您可以使用jsonmap并选择更具可读性的name属性。如果网格的内部data将仅包含您需要的数据。 The demo证明了这种方法。它使用以下代码

var mydata = [
        {
          "_id": {"$oid": "50a3f962b7718da1a3090fa9"},
          "config": { "titlepage": { "title": "My First Title", "color": true,
                                     "fontsize": "42/44" } } }
    ];

$('#jqgrid').jqGrid({
    datatype: 'jsonstring',
    datastr: mydata,
    caption: 'Titlepage Parameters',
    gridview: true,
    height: 'auto',
    colModel: [
        {name: 'title',    jsonmap: "config.titlepage.title" },
        {name: 'color',    jsonmap: "config.titlepage.color" },
        {name: 'fontsize', jsonmap: "config.titlepage.fontsize" },
    ],
    pager: '#pageGrid',
    jsonReader: {
        repeatitems: false,
        id: "_id.$oid"
    }
});
$('#jqgrid').jqGrid('navGrid', "#pageGrid",
    { search: true, edit: false, add: false, del: false, refresh: false }, {}, {}, {},
    { recreateFilter: true, overlay: true, multipleSearch: true, multipleGroup: true});

在任何方面我都没有看到在两个演示中搜索都有任何问题。