jqGrid has no addJSONData method

javascript, jqgrid, jquery, json

Solution

The `addJSONData` is very old method which uses still expandos to the DOM element of the grid (`<table>` element). So to use `addJSONData` correctly one should use

jQuery("#list4")[0].addJSONData(json);

See the documentation. More beter way will be to create jqGrid and fill the data directly. You can use

jQuery("#list4").jqGrid({
    datatype: "local",
    data: mydata,
    height: 'auto',
    autowidth: true,
    colNames: ['ID', 'Name'],
    colModel: [
        {name: 'id', index: 'id', width: 60, sorttype: "int", key: true},
        {name: 'name', index:'name', width: 90}
    ],
    caption: "Test",
    gridview: true // !!! improve the performance
});

The format of `mydata` can be like

var mydata = [
        {id: 10, name: "Oleg"},
        {id: 20, name: "Mike"}
    ];

It's allow to use local paging, filtering and sorting of data. The input data need not be sorted.

Alternatively you can use `datatype: 'jsonstring'` and `datastr`. The value of `datastr` can be either JSON string or already parsed object. The data from `datastr` have to be correctly sorted (if you use some `sortname` and `sortorder` parameters) and have the same format as for `datatype: 'json'` (see the documentation). One can use `jsonReader` and `jsonmap` to specify the data format:

var mydata = {
        //total: 1,  // will be ignored
        //page: 1,   // will be ignored
        //records: 2 // will be ignored
        rows: [
            {id: 10, name: "Oleg"},
            {id: 20, name: "Mike"}
        ]
    ];

What is the most strange for me is why you need to load "local JSON data"? Where is the difference to the "local array data source"? You can use $.parseJSON to convert the input data to object or use `datatype: 'jsonstring'` directly. In the most cases the usage of `addJSONData` is because of loading the data from the server manually per jQuery.ajax which is really bed idea (see one from my first posts on the stackoverflow here). jqGrid has a lot of customization options and callbackes like `ajaxGridOptions`, `serializeGridData` and `beforeProcessing`, you can use functions in `jsonReader` (see here) and `jsonmap`, which allows you to load practically any format of input data. Using prmNames, `serializeGridData` and `postData` (see here) you can make practically any customization of the parameters sent to the server. So the usage of low-level `addJSONData` are needed really in extremely very seldom scenarios.

Problem

Original source

Related problems

• How to filter the jqGrid data NOT using the built in search/filter box
• jqgrid reloadGrid with loadonce set to true
• Should one replace the usage addJSONData of jqGrid to the usage of setGridParam(), and trigger('reloadGrid')?