1) In some functions obj parameter are the data from the json response, in other (id and cell) is only a row of data.

2) Every row must have an unique id. So you have to have ids. If there are no ids in your data you should just define ids with respect of one more function. You define a variable

var curId = 0;

and then use in inside the jsonReader:

jsonReader : {

    root: function (obj) { return obj.DATA; },

    cell: function (obj) { return obj; },

    id: function (obj) { curId++; return curId; },

    page: function (obj) { return 1; },

    total: function (obj) { return 1; },

    records: function (obj) { return obj.DATA.length; }

}

Look at http://www.ok-soft-gmbh.com/jq.....space1.htm.

Regards

Oleg

That is awesome. Works great Thank you!

I do have two more questions about your change...

1. I'm trying to understand the code in jsonReader. It looks like you're creating 5 function that receive an "object" parameter. What does the "object" parameter represent? Where is that coming from? Is that the json response?
2. If I take the "id" column out of the query and the grid as shown below, jQuery crashes. Do you know why?

Thanks!

Chris

* The Query
SELECT name, email, phone, comment FROM test_table ORDER by id

* The JSON
{ "COLUMNS":["NAME","EMAIL","PHONE","COMMENT"], 
   "DATA":[ ["Rick Tester","rick@tester.org","555-666-7777","Test comments."],
                  ["Max Headroom","max@headroom.org","555-666-7777","Test comments."],
                  ["Jessica Levalore","jlevalore@Levalore.com","555-666-7777","Test comments."] ]} 

* The jqGrid Cols
...
colNames:['name','email','phone','comment'],
colModel :[ {name:'name', index:'name', width:55},
                 {name:'email', index:'email', width:55},
                 {name:'phone', index:'phone', width:15, align:'center'},
                 {name:'comment', index:'comment', width:150, sortable:false} ],
.... 

Usage of jsonReader is the correct way if you have data in the form like you have, but first of all you should fix the data to make it correct JSON string. The string 555-666-7777 in the last row must be like in all other be quoted like following:

{ "COLUMNS":["ID","NAME","EMAIL","PHONE","COMMENT"],
   "DATA":[ [1,"Rick Tester","rick@tester.org","555-666-7777","Test comments."],
                  [5,"Max Headroom","max@headroom.org","555-666-7777","Test comments."],
                 [13,"Jessica Levalore","jlevalore@Levalore.com","555-666-7777","Test comments."] ]}

A good place where you can verify your JSON data is http://www.jsonlint.com/.

Best regards
Oleg

I know the JSON data is being returned to the client. I checked the response header.

Would someone please help figure out what am I missing? How can I display the data below in the grid? 

Do I have to massage the JSON results to the expected default format? Or can I customize the format to fit the data returned?

Thank You!

Chris 

My server-side sql query looks like this:

SELECT id, name, email, phone, comment FROM test_table ORDER by id

The returned JSON data looks like this:

{ "COLUMNS":["ID","NAME","EMAIL","PHONE","COMMENT"], 

   "DATA":[ [1,"Rick Tester","rick@tester.org","555-666-7777","Test comments."],

                  [5,"Max Headroom","max@headroom.org","555-666-7777","Test comments."],

                 [13,"Jessica Levalore","jlevalore@Levalore.com",555-666-7777,"Test comments."] ]}  

Here's my jqGrid code:

jQuery("#leadlist").jqGrid({

url:'/hub/get-leads',

datatype: 'json',

mtype: 'GET',

colNames:['id', 'name','email','phone','comment'],

colModel :[

{name:'id', index:'id', formatter:'integer', width:55},

{name:'name', index:'name', width:55},

{name:'email', index:'email', width:55},

{name:'phone', index:'phone', width:15, align:'center'},

{name:'comment', index:'comment', width:150, sortable:false}

],

jsonReader : { root: "DATA" },

autoWidth:true,

altRows:true,

pager: '#leadpager',

rowNum:15,

rowList:[15,30,45],

sortname: 'name',

sortorder: 'desc',

viewrecords: true,

caption: 'Leads'

});