jqGrid获取了json，但是有空行且没有数据

JSON由Spring 3 MVC @ResponseBody生成

{ "total": "1", "page": "1", "records": "2", "rows": [ { "id": "1", "cell": { "accountId": 1, "userId": 1, "transactionId": 6, "subCatId": 0, "accountName": "Credit Card", "remarks": "Movie Hall Pass", "amount": 250.0, "transactionDate": "2011-03-16", "subCatName": "Entertainment" } }, { "id": "2", "cell": { "accountId": 2, "userId": 1, "transactionId": 7, "subCatId": 1, "accountName": "Savings Bank", "remarks": "Part at Besand Nagar", "amount": 5000.0, "transactionDate": "2011-03-16", "subCatName": "Dine Out" } } ] } 

JQGrid初始化代码：

 $("#transactionLogTable").jqGrid({ url: '/et/transaction/getTransactions?dateValue=03%2F16%2F2011', datatype: "json", loadError: function(xhr,status,error){alert(status+" "+error);}, colNames:['Transaction ID', 'User ID', 'Subcat ID', 'Subcat Name', 'Account ID', 'Account Name', 'Date', 'Amount', 'Notes'], colModel:[ {name: 'transactionId', index: 'transactionId', width: 100}, {name: 'userid', index: 'userId', width: 100}, {name: 'subCatId', index: 'subCatId', width: 100}, {name: 'subCatName', index: 'subCatName', width: 100}, {name: 'accountId', index: 'accountId', width: 100}, {name: 'accountName', index: 'accountName', width: 100}, {name: 'transactionDate', index: 'transactionDate', width: 100}, {name: 'amount', index: 'amount', width: 100}, {name: 'remarks', index: 'remarks', width: 100} ], pager: "#pager", rowNum: 10, rowList: [10,20,30], sortname: 'userId', sortorder: 'asc', viewrecords: true, caption: 'Transactions' }); 

使用QueryString成功命中服务器：

 dateValue=03%2F16%2F2011&_search=false&nd=1300532086871&rows=10&page=1&sidx=userId&sord=asc 

好了，我得到一个显示jqGrid的屏幕，里面有2个空行。 我无法显示行内的数据。

我想这与绘图有关，但我尝试了尽可能多的组合。

包含的文件和版本：

感谢您的帮助。

Firdous Amir

Answer 1

您的主要错误是数据格式错误。 你应该用

 { "total": "1", "page": "1", "records": "2", "rows": [ { "id": "1", "cell": ["1", "1", "6", "0", "Credit Card", "Movie Hall Pass", "250.0", "2011-03-16", "Entertainment" ] }, ... ] } 

代替

 { "total": "1", "page": "1", "records": "2", "rows": [ { "id": "1", "cell": { "accountId": 1, "userId": 1, "transactionId": 6, "subCatId": 0, "accountName": "Credit Card", "remarks": "Movie Hall Pass", "amount": 250.0, "transactionDate": "2011-03-16", "subCatName": "Entertainment" } }, ... ] } 

通常，jqGrid足够灵活，可以读取几乎任何JSON数据。 您可以在列定义中定义jsonReader jqGrid参数，有时还可以定义jsonmap属性。 例如，在您的情况下，可以使用以下jqGrid定义读取数据

 $("#transactionLogTable").jqGrid({ // ... other parameters cmTemplate: {width: 100}, colModel:[ {name:'transactionId', jsonmap: 'cell.transactionId'}, {name:'userId', jsonmap: 'cell.userId'}, {name:'subCatId', jsonmap: 'cell.subCatId'}, {name:'subCatName', jsonmap: 'cell.subCatName'}, {name:'accountId', jsonmap: 'cell.accountId'}, {name:'accountName', jsonmap: 'cell.accountName'}, {name:'transactionDate', jsonmap: 'cell.transactionDate'}, {name:'amount', jsonmap: 'cell.amount'}, {name:'remarks', jsonmap: 'cell.remarks'} ], height: "auto", jsonReader: { repeatitems: false } }); 

在这里，我使用jsonReader: { repeatitems: false }来定义一行的JSON数据不在数组中，但是在for的属性中。 需要像jsonmap: "cell.userId"这样的属性来指定相应网格列的值不应该是行对象的默认userId属性，而是另外是“cell”属性的子属性。 顺便说一句，您使用’userid’作为列名称，并在JSON数据中使用’userId’。 最好使用与JSON数据相同的名称。 在您使用与’name’相同的’index’属性时，您可以删除’index’。 在这种情况下，’name’属性的值将用作’index’。

因为您对网格的所有列都使用了“width：100”属性，所以我使用了cmTemplate: {width: 100}参数来使colModel定义更短，更好阅读。

你可以在这里看到修改过的网格。

我建议您另外在ISO格式YYYY-mm-dd中发布日期，并使用格式化程序： colModel ‘date’和datefmt属性（例如formatter:'date', formatoptions:{newformat:'dm-Y'}, datefmt: 'dm-Y' ）