Using a custom JSON format for jqGrid

Question

I have a JSON file that must be formatted as follows. How can I have jqGrid interpret this format using the jsonmap, colModel, or jsonReader options?

[
  {
    "element1" : {
      "subElement1" : "value",
      "subElement2" : "value"
    }
    "element2" : {
      "subElement3" : "value",
      "subElement4" : "value"
    }
  }, 

  {
    "element1" : {
      "subElement1" : "value",
      "subElement2" : "value"
    }
    "element2" : {
      "subElement3" : "value",
      "subElement4" : "value"
    },

    // . . . etc. . . .
  }
]

colNames will be ["subElement1", "subElement2", "subElement3", "subElement4"].

Thanks a lot for any help.

The answer to this question helped: http://stackoverflow.com/questions/2690657/mapping-json-data-in-jqgrid. My issue has been resolved, but I can't answer my own question for several hours. — Donald T, May 03 '11 at 20:34
I am glad to read that my old answer could help you. It would be better if you write your short answer on your own question and mark it (one day later) as "accepted". In the way your question will be not more seen in the list of [unanswered questions](http://stackoverflow.com/questions/tagged/jqgrid?sort=unanswered&pagesize=50). Best wishes! — Oleg, May 03 '11 at 20:54

pixelbobby · Accepted Answer · 2011-05-03T19:47:52.740

You could always just read the jQGrid API on formatting here: http://www.trirand.com/jqgridwiki/doku.php?id=wiki:colmodel_options

Kind of tricky to provide you with custom formatters considering your values are all strings... It supports sorting for curreny and dates as well.

The demos provide source code here: http://www.trirand.com/blog/jqgrid/jqgrid.html

Also, pretty sure you can just specify a function as the format and in that function return the formatted value. For example, I wrote a function that took a status and returned an image with an icon for that status.

Here's an example:

jQuery("#list2").jqGrid({
    url:'server.php?q=2',
    datatype: "json",
    colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'],
    colModel:[
        {name:'id',index:'id', width:55},
        {name:'invdate',index:'invdate', width:90},
        {name:'name',index:'name asc, invdate', width:100},
        {name:'amount',index:'amount', width:80, align:"right"},
        {name:'tax',index:'tax', width:80, align:"right"},      
        {name:'total',index:'total', width:80,align:"right"},       
        {name:'note',index:'note', width:150, sortable:false}       
    ],
    rowNum:10,
    rowList:[10,20,30],
    pager: '#pager2',
    sortname: 'id',
    viewrecords: true,
    sortorder: "desc",
    caption:"JSON Example"
});

Oh that's right... their wiki is not that great for examples. I used this on a project a while back and just viewed the source from the demos. added another link to this answer. — pixelbobby, May 03 '11 at 19:46
Yes, their wiki is quite poor, and seems to have been written by someone not proficient in English. — Donald T, May 03 '11 at 19:48
What kills me about jqGrid is that they have all kind of options, but simple stuff eludes them. Like why don't they have a default phone number formater... I had to write my own, and it is screwing up some of the css on Asp.net MVC4... Works fine on 2 but four is screwed up for some reason. Boy does this frustrate me. — SoftwareSavant, Jun 07 '12 at 13:55

Using a custom JSON format for jqGrid

1 Answers1