JQgrid 搜索选项未显示

Question

以下是我的代码，我是 JQgrid 的新手，我确实遵循了 wiki 上提供的示例，但由于一些奇怪的原因，我无法在导航栏上看到任何搜索选项，非常感谢任何帮助

 <script src="js/jquery-1.11.0.min.js" type="text/javascript"></script>
        <script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
    <script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
    <script src="js/jquery-ui-1.10.4.custom.js" type="text/javascript"></script>

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

            url: "genxml3.php",
            datatype: "xml",
            mtype: "GET",

            colNames: ["A", "T", "E"],
            colModel: [

                { name: "A", Index: 'Name', width: 155 },
                { name: "T", width: 290 },
                { name: "E", width: 80, align: "right" ,sortable: false},

            ],
            pager: "#pager",
            height:"100%",
            rowNum: 20,
            rowList: [40, 80, 120],
            rownumbers: true, 
            rownumWidth: 40,
            sortname: "invid",
            sortorder: "desc",
            viewrecords: true,
            gridview: true,
            autoencode: true,
            caption: "Digital List"


        })

        });
    jQuery("#list").jqGrid('navGrid','#pager', {edit:false,add:false,del:false}, {},   {}, {}, {multipleSearch:true, multipleGroup:true, showQuery: true}
         );

        </script> 

Answer 1

在我看来原因是navGrid 呼叫的错误位置。目前你把它放在 $(function () {...}) 块之外。所以navGrid 的调用将在之前创建网格并且navGrid 失败。您需要将jQuery("#list").jqGrid('navGrid', ...); 行上移一行来解决问题。

此外，您应该从"A" 列中删除Index: 'Name'。首先 JavaScript 区分大小写，只有 index 和没有 Index 属性。此外，完全不建议使用index 属性，它并不是真正需要的。 sortname: "invid" 选项可能没有多大意义，因为您没有名称为 invid 的列。

另外一句话。您应该包括gridview: true 选项以提高网格的性能并考虑使用loadonce: true 选项。如果您不使用loadonce: true 选项，那么服务器（url: "genxml3.php"）必须实现服务器端分页、排序和过滤（搜索）。如果数据集不是那么大（例如少于 1000 或 10000 行），如果服务器返回 所有数据（如果您有任何使用，最初按 sortname 排序）可能会更有效。 jqGrid 会将返回的数据保存在内部data 参数中，该参数通常用于datatype: "local"，然后它将datatype 更改为"local"。因此 jqGrid 将在本地实现排序、分页和过滤/搜索，而无需向服务器发出任何请求。如果行数不是很大，通常本地排序作为对服务器的请求会很快工作。