Vijay Dixit Vijay Dixit - 3 months ago 30
JSON Question

Load JQGRID on AJAX success with dynamic columns and model

i have done more than enough research in this but still a mystery.
i pulled table schema from server to create columns(

result.colNames
) and model(
result.colModel
) that work fine.

on same result,i am pulling table data(
result.colD
) to populate into JQgrid on success.

Grid is creating fine on success but data is not loading into it.

here are the code and screenshots.

i have spent lot of time in this, then posting here..hope this will be resolved here.

$.ajax({
type: "GET",
url: "webapi/do/pullSchema/"+display,
data: "",
dataType: "json",
success: function(result)
{

colD = JSON.stringify(result.colData);
colN = result.colNames;
colM = result.colModel;

jQuery("#list").jqGrid({
data:JSON.parse(colD),datatype: "local",
colNames:colN, colModel :colM,
pager: jQuery('#pager'),
rowNum: 5,
rowList: [5, 10, 20, 50],
viewrecords: true,
caption: 'DAta from table',
loadtext:'Loading, please wait'});


},
error: function(x, e)
{
alert(x.readyState + " "+ x.status +" "+ e.msg);
}
});


below is sample data sets:

[dbname=null, tables=null, ColNames=[Plan_code, LOB],
colModel=[{name:'Plan_code',index:'Plan_code',width:255}, {name:'LOB',index:'LOB',width:255}], colData=[{LOB=N, Plan_code=C82ACC}, {LOB=P, Plan_code=C82ACC}, {LOB=B, Plan_code=C82ACC}, {LOB=I, Plan_code=C82ACC}, {LOB=I, Plan_code=C82IRA}, {LOB=R, Plan_code=C82IRA}]

Answer

The problem is with colData not being in a format jqgrid expects it's json(This is a common mistake many jqgrid developers make)

See the Question in Here for details.

So in your case the fix would be to manipulate colData and create the right json.

colRows=[{LOB=N, Plan_code=C82ACC}, {LOB=P, Plan_code=C82ACC}, {LOB=B, Plan_code=C82ACC}, {LOB=I, Plan_code=C82ACC}, {LOB=I, Plan_code=C82IRA}, {LOB=R, Plan_code=C82IRA}]

colData = {
"total": 1,
"page": 1,
"records": colRows.count,
rows:[{LOB=N, Plan_code=C82ACC}, {LOB=P, Plan_code=C82ACC}, {LOB=B, Plan_code=C82ACC}, {LOB=I, Plan_code=C82ACC}, {LOB=I, Plan_code=C82IRA}, {LOB=R, Plan_code=C82IRA}]
}



 Send this to jqgrid and then it will know how to display it.
Comments