jqGrid initialized empty when using JSON data

Question

I've been lurking around on various forums, and reading several stackoverflow questions related to this problem, but I can't for the life of me figure out what's wrong.

I try to generate a jqGrid treeGrid, using the following code:

      jQuery("#structureBuilderTable").jqGrid({
        url: 'tree.json',
        datatype:'json',
        mtype:'GET',
        colNames: ["ID", "Description", "Total"],
        colModel: [
        {name:'id', index:'id', width: 1, hidden: true, key: true},
        {name:'desc', index:'desc', hidden: false, sortable: true},
        {name:'num', index:'num', hidden: false, sortable: true}
        ],
        treeGridModel:'adjacency',
        height:'auto',
        width:'500',
        pager:"#ptreegrid",
        treeGrid: true,
        ExpandColumn:'desc',
        ExpandColClick: true,
        caption:"TreeGrid Test"
      });

This is my .json file (for example purposes):

{
    "total": "1",
    "page": "1",
    "records": "2",
    "rows": [
           {"id": "1", "cell": ["1", "Super Item", "300", "0", "null", "false", "false"]},
           {"id": "2", "cell": ["2", "Item 1", "100", "1", "1", "false", "false"]},
           {"id": "3", "cell": ["3", "Sub Item 1", "50", "2", "2", "true", "true"]},
           {"id": "4", "cell": ["4", "Sub Item 2", "25", "2", "2", "false", "false"]},
           {"id": "5", "cell": ["5", "Sub-sub Item 1", "25", "3", "4", "true", "true"]},
           {"id": "6", "cell": ["6", "Sub Item 3", "25", "2", "2", "true", "true"]},
           {"id": "7", "cell": ["7", "Item 2", "200", "1", "1", "false", "false"]},
           {"id": "8", "cell": ["8", "Sub Item 1", "100", "2", "7", "false", "false"]},
           {"id": "9", "cell": ["9", "Sub-sub Item 1", "50", "3", "8", "true", "true"]},
           {"id": "10", "cell": ["10", "Sub-sub Item 2", "50", "3", "8", "true", "true"]},
           {"id": "11", "cell": ["11", "Sub Item 2", "100", "2", "7", "true", "true"]}
    ]
}

(this is pretty much a direct copy of a guide I found online).

Now, the grid is generated, but it doesn't contain any data. The javascript file is in the same directory as 'tree.json', but somehow it doesn't seem to find it. I used the following for debugging purposes:

loadError: function(xhr, status, error) {alert(status +error)}

and this is the alert I got:

errorNot Found

Any help would be greatly appreaciated.

Did you try debugging using Firebug or something else to see if the JSON is actually loaded properly? It looks like it's the JSON that can not be found. — Björn
– Björn, Commented Jun 23, 2011 at 11:20
Yeah, that's the problem. I doesn't seem to find the .json file (maybe I wasn't clear enough on this part). — nicohvi
– nicohvi, Commented Jun 23, 2011 at 11:40
That's quite weird. I've made a basic test with your options and your JSON and everything seems to work just fine. I had to comment out the pager attribute though, but I doubt that's the cause of your problem. A working example can be found here: minvis.nl/jqGrid/tree.html Maybe it's of some use to you. — Björn
– Björn, Commented Jun 23, 2011 at 12:05

Community · Accepted Answer · 2017-05-23 11:55:52Z

0

I hope that the demo created based on your JSON data and the jqGrid will help you to find the error in your code. Probably you just forgot to place the code which create the grid inside of jQuery(function(){/**/});.

Only one tip: If you would like that some tree node will be shown expanded like in my demo, you will have to set not only the "true" value in the last column ("expanded" hidden column), but add "true" value for the hidden "loaded" column of the tree grid. See here and here for more details.

edited May 23, 2017 at 11:55

CommunityBot

11 silver badge

answered Jun 23, 2011 at 12:11

Oleg

222k36 gold badges414 silver badges826 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

nicohvi Over a year ago

Thank you both very much for your help! :-) Turns out it was an external error regarding the project configuration causing the error. I will make good use of both of your demos!

Collectives™ on Stack Overflow

jqGrid initialized empty when using JSON data

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related