搜索在JqGrid中不起作用

不确定为什么搜索在网格中不起作用。单击Find just no response。但它可以弹出搜索表单。 请看图片。

我的代码：

 <script>
    $(document).ready(function () {
        function styleSearchForm(form) {
            var dialog = form.closest('.ui-jqdialog');
            var buttons = dialog.find('.EditTable');
            buttons.find('.EditButton a[id*="_reset"]').addClass('btn btn-sm btn-info').find('.ui-icon').attr('class', 'ace-icon fa fa-retweet');
            buttons.find('.EditButton a[id*="_query"]').addClass('btn btn-sm btn-inverse').find('.ui-icon').attr('class', 'ace-icon fa fa-comment-o');
            buttons.find('.EditButton a[id*="_search"]').addClass('btn btn-sm btn-purple').find('.ui-icon').attr('class', 'ace-icon fa fa-search');
        }
        function styleSearchFilters(form) {
            form.find('.delete-rule').val('X');
            form.find('.add-rule').addClass('btn btn-xs btn-primary');
            form.find('.add-group').addClass('btn btn-xs btn-success');
            form.find('.delete-group').addClass('btn btn-xs btn-danger');
        }

        jQuery(gridSelector).jqGrid({
            url: API_URL + 'GetVendors',
            datatype: 'json',
            mtype: 'GET',
            height: 'auto',
            colNames: ['pkey', 'Company', 'ContactName', 'ContactPhone', 'UserName', 'UserKey', 'Active', 'FacilityId', 'ClientId', 'PhotoURL', 'PushToGP'],
            colModel: [
                {
                    key:true,
                    name: 'pkey', index: 'pkey', width: 50, hidden: true,
                    formatter: 'integer'
                },
                { name: 'Company', width: 120 },
                { name: 'ContactName', width: 110 },
                { name: 'ContactPhone', width: 120 },
                { name: 'UserName', align: "right", width: 90 },
                { name: 'UserKey', align: "right", width: 120, hidden: true },
                { name: 'Active', width: 50, edittype: "checkbox", editoptions: { value: "True:False" }, unformat: aceSwitch },
                { name: 'FacilityId', align: "right", width: 100, formatter: "integer" },
                { name: 'ClientID', align: "right", width: 100, formatter: "integer" },
                { name: 'PhotoURL', align: "right", width: 80 },
                { name: 'PushToGP', align: "right", width: 80, edittype: "checkbox", editoptions: { value: "True:False" }, unformat: aceSwitch }
            ],
            cmTemplate: { autoResizable: true, editable: true },
            rowNum: 10,
            rowList: [10, 20, 30],
            pager: pagerSelector,
            sortname: 'company',
            sortorder: "asc",
            viewrecords: true,
            jsonreader: {
                root: "rows",
                page: "page",
                total: "total",
                records: "records"
            },

            caption: "Vendor Managerment"
        });

        $(gridSelector).jqGrid('navGrid', pagerSelector,
                {
                    //navbar options
                    edit: true,
                    editicon: 'ace-icon fa fa-pencil blue',
                    add: true,
                    addicon: 'ace-icon fa fa-plus-circle purple',
                    del: true,
                    delicon: 'ace-icon fa fa-trash-o red',
                    search: true,
                    searchicon: 'ace-icon fa fa-search orange',
                    refresh: true,
                    refreshicon: 'ace-icon fa fa-refresh green',
                    view: true,
                    viewicon: 'ace-icon fa fa-search-plus grey'
                },

                {
                    //search form
                    recreateForm: true,
                    afterShowSearch: function (e) {
                        var form = $(e[0]);
                        form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />');
                        styleSearchForm(form);
                    },
                    afterRedraw: function () {
                        styleSearchFilters($(this));
                    },
                    multipleSearch: true
                    /**
                                         multipleGroup:true,
                                         showQuery: true
                                         */
                },
                {
                    //view record form
                    recreateForm: true,
                    beforeShowForm: function (e) {
                        var form = $(e[0]);
                        form.closest('.ui-jqdialog').find('.ui-jqdialog-title').wrap('<div class="widget-header" />');
                    }
                }
            );

        jQuery(gridSelector).jqGrid('inlineNav', pagerSelector, {search:true, edit: true, add: true, del: true });
    });


    }
</script>

---

我遗漏了什么吗？

如果您需要在网格中显示的项目总数约为120个，那么我建议您使用客户端排序、分页和筛选。选择的原因是：本地排序、分页和筛选通常比往返服务器更快。因此，如果您甚至有超能力的服务器，那么数据的发送仍然很慢，就像在JavaScript中处理120行一样

要实现客户端排序、分页和筛选，您需要做两件事：

修改（简化）服务器代码（

url:API\u url+'GetVendors'

）以一次返回所有数据。如果您已经实现了访问数据的存储库，那么典型的代码将由一行组成。返回数据的格式可以是所有项的数组

添加jqGrid的

loadonce:true

和

forceClientSorting:true

选项。最后一个选项仅存在于免费jqGrid中。它强制在第一页显示之前对初始加载的数据进行排序

---

您的代码使用服务器端分页排序和数据筛选，因为您没有使用

loadonce:true

。用户单击“查找”按钮后，带有过滤器的请求将发送到服务器

url:API\u url+“GetVendors”

。服务器必须返回已过滤的数据。如果它忽略过滤器并返回相同的未过滤数据，则您可以得到所描述的结果。@Oleg，如果我添加

loadonce:true

，则我只得到第1页。有许多页。您有多少页（总行数）？如果要使用

loadonce:true

，则服务器应立即返回所有页面。如果您有大约1000行或更少的行，那么最好使用

loadonce:true

，因为本地操作在往返服务器时工作得更快。尝试加载、排序和筛选4000行和13列，以及40000行。@Oleg，如果您查看线程中的图像。如果没有

loadonce:true

，则返回12页。每页有10行。如果我添加

loadonce:true

，我只会得到一页。为什么？见我之前的评论。您应该简化

url:API_url+'GetVendors'

的代码，并一次返回所有数据（120行）。如果您使用免费jqGrid，那么您可以通过添加

forceClientSorting:true

选项在客户端对数据进行排序，该选项可以与

loadonce:true

结合使用。我从其他人那里借用了代码。我没有完全理解它。你是说我最初使用服务器端搜索的代码吗？如果是，是哪一个？@Love:你应该在问题后面加上

GetVendors

方法的代码。您当前的代码可能已经实现了需要删除的服务器端分页。Oleg，您是对的。我刚刚更新了我的问题。也许我应该删除90%的代码。@Love:尝试使用

public IEnumerable GetVendors（）{return\u vendorRespository.GetAllVendors（）.AsEnumerable（）；}

或

public IEnumerable GetVendors（）{return（从vendors中的vendor选择new{vendor.pkey，vendor.Company，vendor.ContactName，vendor.ContactPhone，vendor.UserName，Encoding.UTF8.GetString（vendor.UserKey），vendor.Active.ToString（），vendor.FacilityId，vendor.ClientID，vendor.PhotoURL，vendor.PushToGP.ToString（）}）.AsEnumerable（）；}

@Love:你也可以简化你的客户端代码。在这里，了解你使用的jqGrid版本和来自哪个fork是很重要的。免费jqGrid支持例如Font Awesome。你可以轻松自定义设置以使用自定义图标。请参阅。之后，你只需在项目js的所有页面上包含字体定义和所有y我们的其他代码将自动使用该字体。

public dynamic GetVendors(string sidx, string sortOrder, int page, int rows, int pkey)
    {
        var vendors = _vendorRespository.GetAllVendors().AsQueryable();
        var pageIndex = Convert.ToInt32(page) - 1;
        var pageSize = rows;
        var totalRecords = vendors.Count();
        var totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
        if (sidx != null)
        {
            vendors = sortOrder == "asc" ? vendors.OrderBy(sidx) : vendors.OrderBy(sidx + " descending");
        }
        else
        {
            vendors = vendors.OrderBy(x => x.pkey);
        }
        vendors = vendors.Skip(pageIndex * pageSize).Take(pageSize);
        return new
        {
            total = totalPages,
            page = page,
            records = totalRecords,
            rows = (from vendor in vendors
                    select new
                    {
                        cell = new string[]
                        {
                        vendor.pkey.ToString(),
                        vendor.Company,
                        vendor.ContactName,
                        vendor.ContactPhone,
                        vendor.UserName,
                        Encoding.UTF8.GetString(vendor.UserKey),
                        vendor.Active.ToString(),
                        vendor.FacilityId.ToString(),
                        vendor.ClientID.ToString(),
                        vendor.PhotoURL,
                        vendor.PushToGP.ToString()
                        }
                    }).ToArray()
        };
    }