您好我正在使用从后端返回的动态数据实现jqGrid,我正在遵循此处讨论的类似解决方案:
similar stack over flow question
由于某些原因,细胞不会填充数据,我尝试了无数不同的方法,但无法得到任何好处。以下是代码:
$.ajax({
type: "GET",
url: "http://cw-epjdp-d01.tm-gnet.com:10040/wps/PA_Resource_Manager_1/JSONMovementServlet",
dataType: "json",
success: function(result){
var colD = result;
//console.log(colD);
var colN = result.MOVEMENTS.columnNames;
var colM = result.MOVEMENTS.colModelList;
console.log(colN);
$("#movementTable").jqGrid({
datatype: 'local',
data: colD.MOVEMENTS.rows,
colNames: colN,
colModel :colM,
height: "auto",
loadComplete: function(data){
console.log("data loaded...");
},
loadError: function(xhr,status,error){
alert('error');
}
});
},
error: function(x, e){
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});
以下是返回的JSON示例:
{
"MOVEMENTS": {
"currpage": "1",
"totalpages": "3",
"totalrecords": "8",
"rows": [
{
"id": "uid\u003dAshokPandey",
"cells": [
{
"NAME": "uid\u003dAshokPandey",
"DAY1": "Canary Wharf",
"DAY2": "Holiday",
"DAY3": "Holiday",
"DAY4": "Holiday",
"DAY5": "Holiday",
"DAY6": "Holiday",
"DAY7": "Holiday",
"DAY8": "Holiday",
"DAY9": "Holiday",
"DAY10": "Holiday",
"DAY11": "Holiday",
"DAY12": "Holiday",
"DAY13": "Holiday",
"DAY14": "Holiday"
}
]
},
{
"id": "uid\u003dGarethHarris",
"cells": [
{
"NAME": "uid\u003dGarethHarris",
"DAY1": "Canary Wharf",
"DAY2": "Canary Wharf",
"DAY3": "Canary Wharf",
"DAY4": "Canary Wharf",
"DAY5": "Canary Wharf",
"DAY6": "Canary Wharf",
"DAY7": "Canary Wharf",
"DAY8": "Canary Wharf",
"DAY9": "Canary Wharf",
"DAY10": "Canary Wharf",
"DAY11": "Canary Wharf",
"DAY12": "Canary Wharf",
"DAY13": "Canary Wharf",
"DAY14": "Canary Wharf"
}
]
},
{
"id": "uid\u003dKeithPriddle",
"cells": [
{
"NAME": "uid\u003dKeithPriddle",
"DAY1": "Canary Wharf",
"DAY2": "Canary Wharf",
"DAY3": "Canary Wharf",
"DAY4": "Canary Wharf",
"DAY5": "Canary Wharf",
"DAY6": "Canary Wharf",
"DAY7": "Canary Wharf",
"DAY8": "Canary Wharf",
"DAY9": "Canary Wharf",
"DAY10": "Canary Wharf",
"DAY11": "Canary Wharf",
"DAY12": "Canary Wharf",
"DAY13": "Canary Wharf",
"DAY14": "Canary Wharf"
}
]
},
{
"id": "uid\u003dJonathanPopoola",
"cells": [
{
"NAME": "uid\u003dJonathanPopoola",
"DAY1": "Canary Wharf",
"DAY2": "Sickness",
"DAY3": "Sickness",
"DAY4": "Sickness",
"DAY5": "Sickness",
"DAY6": "Sickness",
"DAY7": "Sickness",
"DAY8": "Sickness",
"DAY9": "Sickness",
"DAY10": "Sickness",
"DAY11": "Sickness",
"DAY12": "Sickness",
"DAY13": "Sickness",
"DAY14": "Sickness"
}
]
},
{
"id": "uid\u003dNaveedZaib",
"cells": [
{
"NAME": "uid\u003dNaveedZaib",
"DAY1": "Canary Wharf",
"DAY2": "Sickness",
"DAY3": "Sickness",
"DAY4": "Sickness",
"DAY5": "Sickness",
"DAY6": "Sickness",
"DAY7": "Sickness",
"DAY8": "Sickness",
"DAY9": "Sickness",
"DAY10": "Sickness",
"DAY11": "Sickness",
"DAY12": "Sickness",
"DAY13": "Sickness",
"DAY14": "Sickness"
}
]
},
{
"id": "uid\u003dPooyanFarahani",
"cells": [
{
"NAME": "uid\u003dPooyanFarahani",
"DAY1": "Canary Wharf",
"DAY2": "Canary Wharf",
"DAY3": "Canary Wharf",
"DAY4": "Canary Wharf",
"DAY5": "Canary Wharf",
"DAY6": "Canary Wharf",
"DAY7": "Canary Wharf",
"DAY8": "Canary Wharf",
"DAY9": "Canary Wharf",
"DAY10": "Canary Wharf",
"DAY11": "Canary Wharf",
"DAY12": "Canary Wharf",
"DAY13": "Canary Wharf",
"DAY14": "Canary Wharf"
}
]
},
{
"id": "uid\u003dWendyBuchta",
"cells": [
{
"NAME": "uid\u003dWendyBuchta",
"DAY1": "Canary Wharf",
"DAY2": "AWOL",
"DAY3": "AWOL",
"DAY4": "AWOL",
"DAY5": "AWOL",
"DAY6": "AWOL",
"DAY7": "AWOL",
"DAY8": "AWOL",
"DAY9": "AWOL",
"DAY10": "AWOL",
"DAY11": "AWOL",
"DAY12": "AWOL",
"DAY13": "AWOL",
"DAY14": "AWOL"
}
]
},
{
"id": "uid\u003dEdwardRios",
"cells": [
{
"NAME": "uid\u003dEdwardRios",
"DAY1": "Canary Wharf",
"DAY2": "Canary Wharf",
"DAY3": "Canary Wharf",
"DAY4": "Canary Wharf",
"DAY5": "Canary Wharf",
"DAY6": "Canary Wharf",
"DAY7": "Canary Wharf",
"DAY8": "Canary Wharf",
"DAY9": "Canary Wharf",
"DAY10": "Canary Wharf",
"DAY11": "Canary Wharf",
"DAY12": "Canary Wharf",
"DAY13": "Canary Wharf",
"DAY14": "Canary Wharf"
}
]
}
],
"colModelList": [
{
"INDEX": "NAME",
"LABEL": "NAME",
"WIDTH": "90",
"NAME": "NAME",
"JSONMAP": "CELLS.0.NAME"
},
{
"INDEX": "Mon Jan 31",
"LABEL": "Mon Jan 31",
"WIDTH": "90",
"NAME": "Mon Jan 31",
"JSONMAP": "CELLS.0.Mon Jan 31"
},
{
"INDEX": "Tue Feb 01",
"LABEL": "Tue Feb 01",
"WIDTH": "90",
"NAME": "Tue Feb 01",
"JSONMAP": "CELLS.0.Tue Feb 01"
},
{
"INDEX": "Wed Feb 02",
"LABEL": "Wed Feb 02",
"WIDTH": "90",
"NAME": "Wed Feb 02",
"JSONMAP": "CELLS.0.Wed Feb 02"
},
{
"INDEX": "Thu Feb 03",
"LABEL": "Thu Feb 03",
"WIDTH": "90",
"NAME": "Thu Feb 03",
"JSONMAP": "CELLS.0.Thu Feb 03"
},
{
"INDEX": "Fri Feb 04",
"LABEL": "Fri Feb 04",
"WIDTH": "90",
"NAME": "Fri Feb 04",
"JSONMAP": "CELLS.0.Fri Feb 04"
},
{
"INDEX": "Sat Feb 05",
"LABEL": "Sat Feb 05",
"WIDTH": "90",
"NAME": "Sat Feb 05",
"JSONMAP": "CELLS.0.Sat Feb 05"
},
{
"INDEX": "Sun Feb 06",
"LABEL": "Sun Feb 06",
"WIDTH": "90",
"NAME": "Sun Feb 06",
"JSONMAP": "CELLS.0.Sun Feb 06"
},
{
"INDEX": "Mon Feb 07",
"LABEL": "Mon Feb 07",
"WIDTH": "90",
"NAME": "Mon Feb 07",
"JSONMAP": "CELLS.0.Mon Feb 07"
},
{
"INDEX": "Tue Feb 08",
"LABEL": "Tue Feb 08",
"WIDTH": "90",
"NAME": "Tue Feb 08",
"JSONMAP": "CELLS.0.Tue Feb 08"
},
{
"INDEX": "Wed Feb 09",
"LABEL": "Wed Feb 09",
"WIDTH": "90",
"NAME": "Wed Feb 09",
"JSONMAP": "CELLS.0.Wed Feb 09"
},
{
"INDEX": "Thu Feb 10",
"LABEL": "Thu Feb 10",
"WIDTH": "90",
"NAME": "Thu Feb 10",
"JSONMAP": "CELLS.0.Thu Feb 10"
},
{
"INDEX": "Fri Feb 11",
"LABEL": "Fri Feb 11",
"WIDTH": "90",
"NAME": "Fri Feb 11",
"JSONMAP": "CELLS.0.Fri Feb 11"
},
{
"INDEX": "Sat Feb 12",
"LABEL": "Sat Feb 12",
"WIDTH": "90",
"NAME": "Sat Feb 12",
"JSONMAP": "CELLS.0.Sat Feb 12"
},
{
"INDEX": "Sun Feb 13",
"LABEL": "Sun Feb 13",
"WIDTH": "90",
"NAME": "Sun Feb 13",
"JSONMAP": "CELLS.0.Sun Feb 13"
}
],
"columnNames": [
"NAME",
"Mon Jan 31",
"Tue Feb 01",
"Wed Feb 02",
"Thu Feb 03",
"Fri Feb 04",
"Sat Feb 05",
"Sun Feb 06",
"Mon Feb 07",
"Tue Feb 08",
"Wed Feb 09",
"Thu Feb 10",
"Fri Feb 11",
"Sat Feb 12",
"Sun Feb 13"
]
}
}
请注意JSON已通过http://www.jsonlint.com/验证有效。我别无选择,只能使用提供的ID。
非常感谢提前
答案 0 :(得分:0)
查看加载json数据的演示 http://www.trirand.com/blog/jqgrid/jqgrid.html
或jsonReader的用法 http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data
答案 1 :(得分:0)
在上一个回答中,我告诉你应该使用jqGrid的jsonReader
参数。内部具有“=”字符的id的使用也很糟糕。例如,如果您在数据库"uid=AndrewBryant"
中有id,则可以将"AndrewBryant"
作为HTML ID放在JSON数据中。如果你说你别无选择,我不同意。
在您当前的示例中,您在服务器端犯了太多错误,并且没有使用jsonReader
或localReader
,因此很难对其进行评论。例如,您在cells
列属性中使用jsonmap
,并以JSONMAP
的错误方式使用"NAME": "Mon Jan 31"
列属性中的“CELLS”。在JavaScript中,字符的情况非常重要。此外,您使用data
代替'name',并使用标识符作为值。标识符不能有空格。您当然没有JSON数据中“Mon Jan 31”属性的数据。
最后,您使用data: colD.MOVEMENTS.rows
参数(localReader
)表示使用jsonReader
代替localReader
(请参阅here有关{{1}})。
很抱歉,但您当前的代码和数据非常脏,并且包含很多错误,所有内容都看起来很垃圾,无法正常工作。