Question

感谢Oleg，我的jqGrid现在看起来像这样，并且工作正常。（我的代码之后的问题）

var columnModel = [{ name: 'ID', index: 'ID', sortable: true, summaryType:'count', summaryTpl:'<b>{0} Item(s)</b>' },
{ name: 'FirstName', index: 'FirstName', sortable: true},
{ name: 'LastName', index: 'LastName', sortable: true }
];
var columnNames = ['Id', 'First Name', 'Last Name'];

myGrid.jqGrid({
    url: './WebService.asmx/ViewNQueryData',
    datatype: 'json',
    mtype: 'POST',
    ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
    serializeGridData: function (postData) {
        if (postData.filters === undefined) postData.filters = null;
        return JSON.stringify(postData);
    },
    jsonReader: {
        root: function (obj) { return obj.d.rows; },
        page: function (obj) { return obj.d.page; },
        total: function (obj) { return obj.d.total; },
        records: function (obj) { return obj.d.records; }
    },
    colModel: columnModel,
    colNames: columnNames,
    rowNum: 10,
    rowList: [10, 20, 300],
    sortname: 'ID',
    sortorder: "asc",
    sortable: true,
    pager: "#ViewNQueryPager",
    viewrecords: true,
    gridview: true,
    height: 250,
    shrinkToFit: true,
    grouping: true,
    groupingView: {
        groupField: ['ID'],
        groupColumnShow: [false],
        groupText: ['<b>{0} - {1} Item(s)</b>'],
        groupSummary: [true],
        groupOrder: ['asc'],
        groupDataSorted: true,
        showSummaryOnHide: true
    },
    footerrow: true,
    userDataOnFooter: true,
    gridComplete: function () {
        $('#totalRecordsFound').html(myGrid.jqGrid('getGridParam', 'records') + " Customers");
    },
    onSelectRow: function () { alert("selected"); }
}).jqGrid('navGrid', '#ViewNQueryPager', 
                { edit: false, add: false, del: false, search: true, view: true },//option
                {}, // use default settings for edit
                {}, // use default settings for add
                {}, // delete instead that del:false we need this
                {multipleSearch: true, multipleGroup: true, showQuery: true, onSearch: function (response) { showQueryDetails(); } },
                {height: 250, jqModal: false, closeOnEscape: true} // view options
                );
myGrid.jqGrid('filterToolbar', { stringResult: true, searchOnEnter: true });

由于一些奇怪的原因，我可以选择任何行（其他工作正常），我在浏览器中遇到此例外：

这只发生在chrome中，firefox工作正常。

Uncaught TypeError: Cannot call method 'indexOf' of undefined
$.jgrid.extend.setSelection
e.extend.eachjquery-1.6.2.min.js:16
e.fn.e.eachjquery-1.6.2.min.js:16
$.jgrid.extend.setSelection
$.fn.jqGrid
$.fn.jqGrid.each.$.before.click.bind.ts.p.datatype
f.event.handlejquery-1.6.2.min.js:17
f.event.add.i.handle.k

我需要一些新的眼睛来帮助我，看看我做错了什么......这真让我疯狂..

提前致谢。

修改

我的JSON数据如下：

{"d":{"__type":"JqGridData","total":3,"page":1,"records":24,"rows":[{"id":1,"cell":["1","Prabir","Shrestha"]},{"id":2,"cell":["2","Scott","Gu"]},{"id":3,"cell":["3","Scott","Gu"]},{"id":4,"cell":["4","Bill","Gates"]},{"id":5,"cell":["5","Steve","Ballmer"]},{"id":1,"cell":["1","Prabir","Shrestha"]},{"id":2,"cell":["2","Scott","Gu"]},{"id":3,"cell":["3","Scott","Hanselman"]},{"id":4,"cell":["4","Bill","Hanselman"]},{"id":5,"cell":["5","Steve","Ballmer"]}]}}

Answer 1

您遇到问题的原因是您使用的JSON数据不一致：

{
    "d": {
        "__type": "JqGridData",
        "total": 3,
        "page": 1,
        "records": 24,
        "rows": [
            {"id": 1, "cell": ["1", "Prabir", "Shrestha"]},
            {"id": 2, "cell": ["2", "Scott", "Gu"]},
            {"id": 3, "cell": ["3", "Scott", "Gu"]},
            {"id": 4, "cell": ["4", "Bill", "Gates"]},
            {"id": 5, "cell": ["5", "Steve", "Ballmer"]},
            {"id": 1, "cell": ["1", "Prabir", "Shrestha"]},
            {"id": 2, "cell": ["2", "Scott", "Gu"]},
            {"id": 3, "cell": ["3", "Scott", "Hanselman"]},
            {"id": 4, "cell": ["4", "Bill", "Hanselman"]},
            {"id": 5, "cell": ["5", "Steve", "Ballmer"]}
        ]
    }
}

id字段将用作网格行（id元素）的<tr>属性的值。对应于HTML / XHTML规范 ID必须在页面上唯一。

jqGrid - 无法选择行 - 无法调用未定义的方法'indexOf'

1 个答案: