Question

嗨我在显示jqgird的搜索工具栏时遇到问题，我尝试了几种在线提供的方法，我看到有几个人已经使用了我成功使用的东西，有人可以查看我的代码并让我知道在哪里以及我可能缺少什么，我没有在控制器类中为搜索添加任何代码，我也在使用这些脚本：jquery-1.4.2.min.js，jquery.jqGrid.js，jquery.searchFilter.js ，jqModal.js，jqDnR.js（从PHill HAACK的网站上获取）我想也许是我正在使用的脚本或者css我使用的grid.css来自上面提到的相同网站示例的基本主题

任何建议都将受到赞赏。

jQuery(document).ready(function() {
    jQuery("#list").jqGrid({
        url: '/Home/DynamicGridData/',
        datatype: 'json',
        mtype: 'POST',
        ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
        search: true,
        multipleSearch: true,
        colNames: ['Edit', 'AlertId', 'Policy', 'PolicyRule', 'Alert Status', 'Alert Code', 'Message', 'Category'],
        colModel: [
      { name: 'Edit', edittype: 'select', formatter: 'showlink', sortable: false },
      { name: 'AlertId', index: 'AlertId', sortable: true, sorttype: 'int', autoFit: true, align: 'left', hidden: true },
      { name: 'Policy', index: 'Policy.Name', sortable: true, autoFit: true, align: 'left' },
      { name: 'Policy Rule', index: 'PolicyRule', sortable: true, sorttype: 'text', autoFit: true, align: 'left' },
      { name: 'Alert Status', index: 'AlertStatus.status', sortable: true, sorttype: 'text', autoFit: true, align: 'left' },
      { name: 'Alert Code', index: 'Code', sortable: true, sorttype: 'text', align: 'left', autoFit: true },
      { name: 'Message', index: 'Message', sortable: true, sorttype: 'text', autoFit: true },
      { name: 'Category', index: 'Category.name', sortable: true, sorttype: 'text', align: 'left', autoFit: true}],
        pager:  jQuery('#pager'),
        rowNum: 10,
        rowList: [10, 60, 100],
        scroll: true,
        sortname: 'AlertId',
        sortorder: 'asc',
        gridview: true,
        autowidth: true,
        rownumbers: true,
        viewrecords: true,
        imgpath: '/scripts/themes/basic/images',
        caption: 'Nebo System Alerts'
    });

    jQuery("#list").jqGrid('navGrid', '#pager', { add: false, edit: false, del: false }, {}, {}, {}, { multipleSearch: true, overlay: false });
    jQuery("#list").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: true });
    jQuery("#list").jqGrid('navButtonAdd', '#pager', { caption: "", title: "Toggle Search Bar", buttonicon: 'ui-icon-pin-s',
    onClickButton: function() { $("#list")[0].toggleToolbar() } 
});

Answer 1

如果您的代码中没有显示搜索工具栏，那么您不会选择jqGrid下载期间所需的所有jqGrid组件（请参阅here）。您应该检查“自定义”基本模块，以便能够使用filterToolbar方法。

您没有包含jqGrid加载顺序的整个HTML页面，也没有写入您使用的jqGrid版本以及您测试过的Web浏览器。如果您使用jqGrid的the developer version，我建议您直接安装jqGrid模块（请参阅here），不要使用jquery.jqGrid.js。

代码中的一个更重要的问题：您使用colModel中的列，name属性具有空白（name: 'Policy Rule'，name: 'Alert Status'，name: 'Alert Code'）。这不行。您应该选择任何其他名称。如果您的JSON数据具有空白属性（不推荐）并且您无法更改服务器代码，则应使用jsonmap属性和JSON输入中的相应名称（如name: 'PolicyRule', jsonmap:'Policy Rule'）。

在jqgrid中显示搜索工具栏的问题

1 个答案: