我正在尝试从struts动作传递colModel和列。就像在问题中一样 jqGrid and dynamic column binding
我不确定我错过了什么。请帮忙。花了不少时间试图把它弄好。
JSP：
<script type="text/javascript">
$(document).ready(function(){
$.ajax(
{
type: "POST",
url: "interFinalTbaAction.action",
data: "",
dataType: "json",
success: function(result){
colD = result.couponStripList;
colN = result.columnNames;
colM = result.colModelList;
jQuery("#dataGrid").jqGrid({
jsonReader : {
repeatitems: false,
root:"rootVar",
cell: "",
id: "0"
},
url: 'SomeUrl/Getdata',
datatype: 'jsonstring',
mtype: 'POST',
datastr : colD,
colNames:colN,
colModel :colM,
loadComplete: function(data){alert('loaded');},
loadError: function(xhr,status,error){
alert('error');
}
})
},
error: function(x, e){
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});
});
</script>
<h2>Inter Final Prices</h2>
<table id="dataGrid">
</table>
</html>
我的行动回归的JSON是
{
"colModelList": [
{
"index": "prceCM",
"jsonmap": null,
"key": false,
"name": "prceCM",
"resizeable": true,
"search": true,
"sortable": false,
"title": "03-01-11",
"width": 300
},
{
"index": "prceCMPlusOne",
"jsonmap": null,
"key": false,
"name": "prceCMPlusOne",
"resizeable": true,
"search": true,
"sortable": false,
"title": "04-01-11",
"width": 300
},
{
"index": "prceCMPlusTwo",
"jsonmap": null,
"key": false,
"name": "prceCMPlusTwo",
"resizeable": true,
"search": true,
"sortable": false,
"title": "05-01-11",
"width": 300
},
{
"index": "prceCMPlusThree",
"jsonmap": null,
"key": false,
"name": "prceCMPlusThree",
"resizeable": true,
"search": true,
"sortable": false,
"title": "06-01-11",
"width": 300
},
{
"index": "coupon",
"jsonmap": null,
"key": false,
"name": "coupon",
"resizeable": true,
"search": true,
"sortable": false,
"title": null,
"width": 300
}
],
"columnNames": [
"prceCM",
"prceCMPlusOne",
"prceCMPlusTwo",
"prceCMPlusThree",
"coupon"
],
"couponStripList": {
"rootVar": [
{
"coupon": 5.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"coupon": 5.5,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"coupon": 6.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"coupon": 6.5,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"coupon": 7.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
}
]
},
"deliveredDataTimestamp": null,
"requestedTimestamp": null
}
感谢。
答案 0 :(得分：10)
在我的测试your code中工作。然而，因为你的问题的主题对于许多jqGrid用户来说很有意思，所以我在你的代码和JSON数据中写下一些小错误和优化。
第一个也是最重要的问题是物品的ID。 id:"0"内的jsonReader设置错误。仅当数据项是数组而不是具有命名属性的对象（repeatitems:false）时，才能使用它。目前，行的ID将使用整数1,2，...我严格建议您在JSON数据的rootVar项中包含id信息。
下一个问题。属性"title": "03-01-11"是错误的。 colModel的{{3}}属性为 boolean ，因此应更改为"title": true。关闭问题：您使用resizable的属性resizeable在英语中可能更正确，但jqGrid会忽略它。
现在小优化：
datatype:'jsonstring', datastr:colD更改为datatype: 'local', data: colD.rootVar gridview: true参数。url: 'SomeUrl/Getdata'或mtype: 'POST'，设置datatype:'jsonstring'和datatype:'local'将被忽略。所以你应该删除jqGrid的参数。jsonmap不会在您的数据模型中使用，我建议您将其从JSON数据中删除。label的其他colModel属性。如果您不再需要colNames（数据中columnNames）。您可以看到"title"的原始演示（我只对type的更改进行了`类型：“GET”因为我没有活动的服务器组件并将JSON保存为文本文件） 。我建议修改后的同一个演示是here。
方式的主要限制是所有数据都是本地。因此，您可以使用本地排序，过滤和分页，但如果您确实需要服务器端排序，过滤和分页，则必须在jqGrid中包含更多其他代码。
我建议你得到的代码是：
$(document).ready(function () {
$.ajax({
type: "GET",
url: "DynamicColumnBinding1.txt",
dataType: "json",
success: function(result){
var colD = result.couponStripList,
colM = result.colModelList;
$("#dataGrid").jqGrid({
datatype: 'local',
data: colD.rootVar,
gridview: true,
colModel :colM,
height: "auto",
loadComplete: function(data){
alert('loaded');
},
loadError: function(xhr,status,error){
alert('error');
}
});
},
error: function(x, e){
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});
});
相应的JSON数据可以是例如
{
"colModelList": [
{
"index": "prceCM",
"label": "CM",
"name": "prceCM",
"width": 100
},
{
"index": "prceCMPlusOne",
"label": "CM + 1",
"name": "prceCMPlusOne",
"width": 100
},
{
"index": "prceCMPlusTwo",
"label": "CM + 2",
"name": "prceCMPlusTwo",
"width": 100
},
{
"index": "prceCMPlusThree",
"label": "CM + 3",
"name": "prceCMPlusThree",
"width": 100
},
{
"index": "coupon",
"label": "Coupon",
"name": "coupon",
"align": "right",
"sorttype": "number",
"formatter": "number",
"formatoptions": {
"thousandsSeparator": ","
},
"width": 100
}
],
"columnNames": [
"prceCM",
"prceCMPlusOne",
"prceCMPlusTwo",
"prceCMPlusThree",
"coupon"
],
"couponStripList": {
"rootVar": [
{
"id": 71,
"coupon": 5.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"id": 72,
"coupon": 5.5,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"id": 73,
"coupon": 6.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"id": 74,
"coupon": 6.5,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
},
{
"id": 75,
"coupon": 7.0,
"prceCM": "Not Available",
"prceCMPlusOne": "Not Available",
"prceCMPlusThree": "Not Available",
"prceCMPlusTwo": "Not Available"
}
]
},
"deliveredDataTimestamp": null,
"requestedTimestamp": null
}