jqGrid没有显示java服务返回的响应。
HTML:
<table id="fbDetailTable" style="display: none"></table>
Java脚本:
jQuery("#fbDetailTable").jqGrid({
url: "/ReportBatch/rs/ReportService/getFB?fB="+frtBill,
datatype: "json",
colNames: ['Store Number', 'Order Number', 'SKU number',
'Shipped Quantity','Order Created Date'],
colModel:[{name:'strNbr',index:'strNbr',width:100,jsonmap:'strNbr'},
{name:'orderNbr',index:'orderNbr',width:100,jsonmap:'orderNbr'},
{name:'skuNbr',index:'skuNbr',width:100,jsonmap:'skuNbr'},
{name:'shpdQty',index:'shpdQty',width:100,jsonmap:'shpdQty'},
{name:'ordCrtDt',index:'ordCrtDt',width:100,jsonmap:'ordCrtDt'}],
jsonReader: { repeatitems : false, strNbr: "0" },
viewrecords: true,
loadonce:true,
caption:"Order Details"
});
服务回复:
[{"strNbr":"6310",
"orderNbr":"10979577",
"skuNbr":"646274",
"shpdQty":"1",
"ordCrtDt":"2013-01-29"},
{"strNbr":"6310",
"orderNbr":"10979583",
"skuNbr":"765992",
"shpdQty":"3",
"ordCrtDt":"2013-01-29"
}]
响应标题:
Content-Type application/json
Date Mon, 04 Feb 2013 20:21:24 GMT
Server Apache-Coyote/1.1
Transfer-Encoding chunked
答案 0 :(得分:0)
主要错误是您的输入JSON数据没有“rows”属性,并将数据直接作为数组放置。如果你应该使用
root: function (obj) { return obj; }
在jsonReader
内。此外,设置strNbr: "0"
是错误的。它应该是id: "strNbr"
。
另外,使用rowNum
一些足够大的值作为默认值25(参见the documentation)非常重要。如果不这样做,jqGrid将只显示第25行的第一行数据。这不是你想要的。
我严格建议您使用的其他重要选项包括:gridview: true
,autoencode: true
。在大多数情况下,选项height: "auto"
也非常实用。所以代码应该是关于以下的
$("#fbDetailTable").jqGrid({
url: "AVVD.json",
datatype: "json",
colNames: ["Store Number", "Order Number", "SKU number",
"Shipped Quantity", "Order Created Date"],
colModel: [
{ name: "strNbr" },
{ name: "orderNbr" },
{ name: "skuNbr" },
{ name: "shpdQty" },
{ name: "ordCrtDt" }
],
cmTemplate: { width: 120 },
jsonReader: {
repeatitems: false,
id: "strNbr",
root: function (obj) {
return obj;
}
},
rowNum: 10000,
gridview: true,
autoencode: true,
height: "auto",
viewrecords: true,
loadonce: true,
caption: "Order Details"
});
您还可以声明像
这样的变量var intTemplate = { sorttype: "integer", formatter: "integer" },
dateTemplate = { sorttype: "date", formatter: "date" };
并使用模板(请参阅the answer)并将colModel
修改为以下
colModel: [
{ name: "strNbr", template: intTemplate },
{ name: "orderNbr", template: intTemplate },
{ name: "skuNbr", template: intTemplate },
{ name: "shpdQty", template: intTemplate },
{ name: "ordCrtDt", template: dateTemplate }
]
结果演示您将看到here: