Mapping JSON data in JQGrid

by

First of all the code posted has some errors like dtatype: "json" instead of datatype: "json". “},});” instead of “}});” at the end of code and colNames: ['Stud Name','Year','Date'.'Number'] instead of colNames: ['Stud Name','Year','Date','Number']. After fixing this clear bugs you need change jsonmap values. This was your main question. The fixed code will be look like following:

jQuery("#"+subgrid_table_id).jqGrid({
    ...
    datatype: 'json',
    colNames: ['Stud Name','Year','Date'.'Number'],
    colModel: [
        {name:'student_name', width:100, jsonmap:"head.student_name"},
        {name:'year', width:100, jsonmap:"head.year"},
        {name:'date', width:100, jsonmap:"sub.0.date"},
        {name:'number', width:100, jsonmap:"sub.0.number"}
    ],
    jsonReader: { repeatitems:false, root:"rows" }
});

You have to fix root to “rows” and use jsonmap in JSON dot notation (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:retrieving_data#json_dot_notation). I use a little strange notation like “sub.0.number” because sub.0.number in JavaScript is the same as sub[0].number. It works now.

I recommend you think one more about the structure of JSON data which you receive. (see my previous comments to you question): Is “sub” element is really an array with always one element or you want to use subgrids? Probably the data should be changed from sub:[{"":"", ...}] to sub:{"":"", ...}? What do you want to use as a rowid? student_name? Then add id: "head.student_name" to the jsonReader definition or add key: true property to the definition of the column student_name. Or you forget to include it in the JSON data?

And the last suggestion. If you open http://trirand.com/blog/jqgrid/jqgrid.html and opens on the left side of tree the branch “Data Mapping” \ “Data optimization” you will see an example where on use only array instead of named elements in JSON. Such data will be have minimum size and can be transferred more quickly from server to client. You data instead have some fields (like “course_description“) which you don’t use at all. So if you can make any changes in the server code try to optimize the data transfer rate.

More Related Contents:

  1. JQuery Grid-SubGrid for Parent-Child relation
  2. jqGrid returns blank cells
  3. jqgrid subgrids from a single nested json
  4. JQgrid total amount row
  5. Parsing JSON with Unix tools
  6. How to escape special characters in building a JSON string?
  7. Importing local json file using d3.json does not work
  8. JSON Invalid UTF-8 middle byte
  9. JSON Naming Convention (snake_case, camelCase or PascalCase) [closed]
  10. How to import JSON File into a TypeScript file?
  11. Could not load file or assembly ‘Newtonsoft.Json’ or one of its dependencies. Manifest definition does not match the assembly reference
  12. Unix command-line JSON parser? [closed]
  13. how to parse a JSON String with jq (or other alternatives)?
  14. How to serialize or convert Swift objects to JSON?
  15. Unmarshaling json in Go: required field?
  16. UnicodeDecodeError: ‘utf8’ codec can’t decode byte 0x80 in position 3131: invalid start byte
  17. Downloading JSON with NSURLSession doesn’t return any data
  18. How to fetch data from local JSON file on react native?
  19. Standard way of referencing an object by identity (for, eg, circular references)?
  20. List of Language Codes in YAML or JSON? [closed]
  21. How to generate JSON response from JSF?
  22. Which Perl module would you recommend for JSON manipulation?
  23. Encode/Decode Array of Types conforming to protocol with JSONEncoder
  24. iteration a json object on Ngfor in angular 2
  25. How to exclude properties from Swift Codable?
  26. JSON Parsing in Swift 3
  27. How can I use JSON on the web page from a source with neither CORS nor JSONP? [closed]
  28. Grails JSONBuilder
  29. Can a JSON value contain a multiline string
  30. Convert two types into a single type with Serde

Leave a Comment