I am new to jQuery and have just started working with jqGrid. I looked through jqGrid docs to figure out how to display some data that I get in JSON format in my grid, but to no avail. When I create a grid, it displays with the correct headers, pager information, etc. Both through Firebug and I can see the JSON data request and response. The JsonReader below is one of many that I have tried, and in function callbacks I can log certain values that I get, so I know that I get data.
What is the correct way to load the JSON indicated below loaded in jqGrid?
Here is the relevant code:
HTML:
<div id="dataInfo">
<table id="dataTable"></table>
<div id="dataTablePager"></div>
</div>
Js
jQuery("#dataTable").jqGrid({
url: 'http://<snip>',
mtype: 'GET',
datatype: 'json',
jsonReader: {
root: 'ipResponses',
id: 'startIP',
repeatitems: false,
page: function(obj) { return 1; },
total: function(obj) { return 1; },
records: function(obj) { return obj.ipInfo.ipResponses.length; },
userdata: "userData"
},
colNames: ['StartIP', 'EndIP'],
colModel: [
{
name: 'startIP',
index: 'startIP',
width: 55
},
{
name: 'endIP',
index: 'endIP',
width: 55
}
],
pager: '#dataTablePager',
rowNum: 8,
rowList: [25,50,100],
sortname: 'startIP',
sortorder: 'asc',
viewrecords: true,
caption: 'Data',
pgtext:"Page {0}"
});
Json
{
"ipInfo": {
"queryStartIP": "4.4.4.0",
"queryEndIP": "4.4.4.256",
"ipResponses": [
{ "startIP": "4.4.4.1", "endIP": "4.4.4.5"},
{ "startIP": "4.4.4.10", "endIP": "4.4.4.15"}
]
}
}