使用filterToolbar进行jqGrid客户端搜索

时间:2013-09-19 23:08:06

标签: json jqgrid client-side

我试图通过filterToolbar方法启用jqGrid的客户端搜索功能,但我无法使其工作。网格正在通过页面加载(document.ready)上的asmx服务返回的JSON正确加载数据,但是当我尝试使用搜索工具栏搜索任何列时,网格只刷新而不进行搜索。

我已经检查了其他类似的问题和答案,但没有一个能帮我解决问题。也许有人可以检查我下面的jqGrid脚本并告诉我它有什么问题或缺少什么。作为参考,我使用的是jqGrid的版本“4.5.2”。

$('#tblTargetDetails').jqGrid({
    url: 'PostHandlers/CommonHandler.asmx/GetTargetDetails',
    datatype: 'json',
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
    ajaxRowOptions: { contentType: "application/json; charset=utf-8", dataType: "json" },
    postData: "{'TargetID': '" + TargetID + "'}",
    mtype: 'POST',
    colNames: ['Team ID', 'Member UserID', 'Measure', 'Product', 'Month1', 'Month2'],
    colModel: [
      { name: 'TeamID', index: 'TeamID', width: 55, search: true, sorttype: 'int' },
      { name: 'MemberUserID', index: 'MemberUserID', width: 90, search: true, stype: 'text' },
      { name: 'Measure', index: 'Measure', width: 90, search: true, searchoptions: {} },
      { name: 'Product', index: 'Product', width: 90, search: true },
      { name: 'Month1', index: 'Month1', width: 80, editable: true, search: true },
      { name: 'Month2', index: 'Month2', width: 80, editable: true, search: false }],
    jsonReader: {
        root: "d.TargetDetails",
        records: "d.RecordsCount",
        id: "ID",
        cell: "",
        page: function () { return 1; },
        total: function () { return 1; },
    },
    pager: '#pnlTargetDetails',
    rowNum: 50,
    rowTotal: 2000,
    rowList: [20, 30, 50],
    loadonce: true,
    viewrecords: true,
    gridview: true,
    ignoreCase: true,
    rownumbers: true,
    caption: 'Target Details',
    editurl: 'PostHandlers/CommonHandler.asmx/EditTargetDetail',
    serializeRowData: function (postData) {

        return JSON.stringify({ 'content': JSON.stringify(postData), 'UserID': UserID });
    },
    onSelectRow: function (id) {
        if (id && id !== lastSel) {
            $('#tblTargetDetails').restoreRow(lastSel);
            lastSel = id;
        }
        $('#tblTargetDetails').jqGrid('editRow', id, true);

    }
});

$('#tblTargetDetails').jqGrid('navGrid', '#pnlTargetDetails', { search: true, edit: false, add: false, del: false });

$('#tblTargetDetails').jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false });

提前感谢您的帮助。

感谢。

0 个答案:

没有答案