How to display nested Json object in Jqgrid

Question

I'm fairly new to jqgrid How can I show nested json objects inside a jqgrid as individual fields?? below given is the example of json object

[
 {
"properties":{
 "x":1,
 "y":78093,
 "closeDate":null,
 "
},
"children":[
 {
    "properties":{

       "option":null,
       "type":"",
       "client":"southface",

       "categoryA":[
          "x",
          "w"
       ],
       "facilitiesOther":null,
       "objectId":10,

       "docNo":7897,
       "Provisions":[
          "x",
          "z"
       ],


       "sponsor":"own sponsor",


       "CategoryB":[
          "e",
          "f",
          "g"

       ]

       ]
    },
    "children":null,
    "Type":"test",
    "Id":"10"
 }
  ],
  "objectType":"document",
 "objectId":"89763"
   }
  ]

after fair amount of research I found somewhere that it requires modifying the colmodel Something towards this issue would be very helpful thanks in advance

score 1 · Accepted Answer · edited May 23 '17 at 10:25

1

You should use jsonMap. You should also look at jqGrid wiki and this specific topic. You can try something like this:

colNames:['Children','ID', 'Properties', 'Other','Sponsor'],
colModel: [
    {name:'children',width:100, jsonmap:"children.0", formatter: function (cellvalue) { return cellvalue.children }},
    {name:'objectId',width:100, jsonmap:"children.0", formatter: function (cellvalue) { return cellvalue.objectType }},
    {name:'properties',width:100, jsonmap:"children.0", formatter: function (cellvalue) { return cellvalue.properties.objectId }},
    {name:'other',width:100, jsonmap:"children.0", formatter: function (cellvalue) { return cellvalue.properties.other[0] }},
    {name:'sponsor',width:100, jsonmap:"children.0", formatter: function (cellvalue) { return cellvalue.properties.sponsor }}
    // and so on...
],

This is obviously not the best approach because you'll have to know how many records you have on your JSON and do it manually for each one. Actually, I don't know how you could make it automatically, but as I said, if you look out for jsonMap on jqGrid wiki you'll probably find what you want. Best of luck!

edited May 23 '17 at 10:25

Community

1
1

answered May 14 '14 at 17:53

lucasdc

1,032
2
20
42

I tried using that But not working for me I'm rather confused with what i should be adding as root Can you be abit more specific with the issue?? because I can't find a solution with the json with this particular format jsonReader : { repeatitems: true, root: "children" } – Gotham's Reckoning May 14 '14 at 18:50
thanks lucasdc surprisingly this is the similar approach I'm using right now (before posting the question) But this approach would give only one set of values the json I recevie would have multiple values in it which means the value of 0 in "children.0.properties.client" tend to change and I have to do a merging of multiple fields for which currently I'm using formatter function formatter: function myFormatter(cellvalue, options, rowObject){ return rowObject.children.0.properties.client +rowObject.children.0.properties. type } – Gotham's Reckoning May 14 '14 at 19:44
and in this case the '0' is not recognized as well which further adds more trouble to me I hope I was able to explain the issue :( Hopes that you could help me – Gotham's Reckoning May 14 '14 at 19:45
I couldn't get it straight. What you mean by "would have multiple values in it which means the value of 0 in "children.0.properties.client" tend to change"? It means "properties" will not always be at index 0 of array? Take a look at this and tell me if that helps you – lucasdc May 14 '14 at 20:07
Below given is the exact json structure I'm talking about since its too long I'm adding it as 2 comments PLease combine it to know the exact json [ { "children": [ { "children": null, "objectId": "1", "objectType": "forms", "properties": { "objectId": 1, "other": [ null ], "sponsor": null } }, – Gotham's Reckoning May 14 '14 at 20:21
{ "children": null, "objectId": "240", "objectType": "forms", "properties": { "objectId": 240, "other": [ null ], "sponsor": null } }, – Gotham's Reckoning May 14 '14 at 20:21
{ "children": null, "objectId": "242", "objectType": "forms", "properties": { "objectId": 242, "other": [ null ], "sponsor": null } }, – Gotham's Reckoning May 14 '14 at 20:22
{ "children": null, "objectId": "243", "objectType": "forms", "properties": { "objectId": 243, "other": [ null ], "sponsor": "xvy" } } ], "objectId": "4102901", "objectType": "Matters", "properties": { "billable": true, "clientNumber": "5629", "clientFullName": "xyz", "shortName": "x" } } ] this is the end – Gotham's Reckoning May 14 '14 at 20:22
I got it... I cannot help you right now 'cause I'm doing other stuff. I'll try to help you when I have a spare time... Until there you can take a look at [this link](http://stackoverflow.com/questions/6631416/jqgrid-and-json-array) and see if that helps you. Best of luck! – lucasdc May 14 '14 at 20:27
thanks @lucasdc appreciate that I will be looking into this If you could post me the solution when you are free from your work it would be super helpful In the mean time if I could find the solution I will post it thanks again and in advance :) – Gotham's Reckoning May 14 '14 at 20:32

How to display nested Json object in Jqgrid

1 Answers1

Linked