JqGrid 搜索不起作用答案

【问题标题】：JqGrid Search not functioningJqGrid 搜索不起作用
【发布时间】：2014-09-24 10:11:21
【问题描述】：

这是 JqGrid。这里 GridSearch 有问题。在这里我使用 InvoiceId 进行搜索。但它不起作用。但是当我单击搜索按钮时它会显示加载面板。

我的数据类型是 Json。我看到有一个有效的链接，我也尝试这样做，但它在我的场景中不起作用。 LINK

 <script type="text/javascript">
                 $(function () {
        $('#jqgrid').jqGrid({

            url: 'Sales/GetAllSalesOrders/',

            datatype: 'json',
            mtype: 'GET',
            //columns names
            colNames: ['InvoiceId', 'CustomerId', 'SubTotal', 'TotalDiscount', 'VAT', 'NBT', 'Amount', 'Balance'],
            //columns model
            colModel: [
                        { name: 'InvoiceId', index: 'InvoiceId', align: 'left' },
                        { name: 'CustomerId', index: 'CustomerId', align: 'left' },
                        { name: 'SubTotal', index: 'SubTotal', align: 'left' },
                        { name: 'FullDiscount', index: 'FullDiscount', align: 'left' },
                        { name: 'Vat', index: 'Vat', align: 'left' },
                        { name: 'Nbt', index: 'Nbt', align: 'left' },
                        //{ name: 'Total', index: 'Total', align: 'left' },
                        { name: 'NetAmount', index: 'NetAmount', align: 'left' },
                        { name: 'Balance', index: 'Balance', align: 'left' }
            ],

            pager: $('#jqgrid'),
            rowNum: 10,
            sortname: 'InvoiceId',
            sortorder: 'asc',
            viewrecords: true,
            width: 'auto',
            height: 'auto',
            rowNum: 50,
            rowTotal: 200,
            rowList: [20, 30, 50, 100],
            rownumbers: false,
            rownumWidth: 40,
            subGrid: true,

            //subrid model
            subGridModel: [{
                //subgrid columns names
                // name: ['InvoiceItemId', 'Quantity', 'Rate', 'DiscountAmount', 'Amount'],
                name: ['InvoiceItemId', 'Quantity'],
                width: [100, 100],
                align: ['left', 'left'],

                //data: { id: id }
            }],
            //url from which subgrid data should be requested
            subGridUrl: '/Sales/GetSalesItemsByInvoiceId/'

        });


    });

    $("#mySearch").click(function () {
        debugger;
        var grid = $("#jqgrid");
        var text = $("#searchText").val();
        var postdata = grid.jqGrid('getGridParam', 'postData');

        $.extend(postdata,
                       {
                           filters: '',
                           searchField: 'InvoiceId',
                           searchOper: 'eq',
                           searchString: 'text',
                       });
        grid.jqGrid('setGridParam', { search: true, postData: postdata });
        grid.trigger("reloadGrid", [{ page: 1 }]);

    });

</script>

【问题讨论】：

标签： jquery asp.net-mvc c#-4.0 jqgrid

【解决方案1】：

首先，您应该将代码中的searchString: 'text', 替换为searchString: text。我希望你在服务器端实现搜索（到url: 'Sales/GetAllSalesOrders/'），因为searchField、searchOper 和searchString 将只是发送到服务器并且你的服务器代码将实现搜索。如果你需要在客户端使用搜索，你应该使用loadonce: true。

其次，我建议您将gridview: true 选项添加到网格中，将pager: $('#jqgrid') 替换为pager: '#jqgrid'，通过删除不需要的index 属性和align: 'left' 来简化colModel。

【讨论】：