我试图从struts动作传递colModel和列.就像问题 jqGrid和动态列绑定一样
我不确定我错过了什么.请帮忙.花了不少时间试图把它弄好.
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>
Run Code Online (Sandbox Code Playgroud)
我的行动回归的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
}
Run Code Online (Sandbox Code Playgroud)
谢谢.
Ole*_*leg 10
在我的测试中,您的代码有效.然而,因为你的问题的主题对于许多jqGrid用户来说很有趣,所以我在你的代码和JSON数据中写下一些小错误和优化.
第一个也是最重要的问题是物品的ID.id:"0"里面的设置jsonReader是错误的.仅当数据项是数组而不是具有命名属性(repeatitems:false)的对象时,才能使用它.目前作为行的ID将使用整数1,2,...我严格建议您在rootVarJSON数据项中包含id信息.
下一个问题.该属性"title": "03-01-11"是错误的.在"标题"的属性colModel是布尔值,所以应该改成"title": true.关闭问题:resizable您使用的属性resizeable在英语中可能更正确,但jqGrid会忽略它.
现在小优化:
datatype:'jsonstring', datastr:colD改为datatype: 'local', data: colD.rootVargridview: true参数.url: 'SomeUrl/Getdata',和mtype: 'POST',将在以下情况下被忽略datatype:'jsonstring'或者datatype:'local'.所以你应该删除jqGrid的参数.jsonmap不会在您的数据模型中使用,我建议您从JSON数据中删除它.label属性更好colModel.如果您不再需要colNames(columnNames在您的数据内).您可以在此处看到原始演示(我只type对`type:"GET" 进行了更改"因为我没有活动的服务器组件并将JSON保存为文本文件).我建议修改后的相同演示就在这里.
方式的主要限制是所有数据都是本地的.因此,您可以使用本地排序,过滤和分页,但如果您确实需要服务器端排序,过滤和分页,则必须在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);
}
});
});
Run Code Online (Sandbox Code Playgroud)
相应的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
}
Run Code Online (Sandbox Code Playgroud)