JqGrid - can not select rows - Cannot call indexOf method from undefined

Question

Thanks to Oleg, my jqGrid now looks like this and works just fine. (my problem is after code)

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 }); 

For some odd reason, I can select any line (evrything else works fine), and I get this exception in the browser:

This only happens in chrome, firefox works fine.

 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 

I need new eyes to help me and see what I did wrong ... it really drives me crazy ..

Thanks in advance.

EDIT

My JSON data is like:

 {"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

The cause of your problem is the inconsistent JSON data that you are using:

 { "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"]} ] } } 

The submitted id will be used as the id attribute value for the grid lines ( <tr> elements). Meets HTML / XHTML specification identifiers must be unique on the page .