CODEWITHSUNDEEP
javascriptjqueryjqgrid
pomkine
pomkine

Reputation: 1615

jqGrid fill grid with data

I need to fill my jqGrid with data received from ajax call. Here is my jqGrid code:

$("#discuss_table_answers").jqGrid({
        datatype: "local",
        jsonReader: {
            root: "list",
            repeatitems: false,
            records: "size"
        },
        colNames: ['agentId', 'date', 'deleted', 'id', 'questionId', 'rating', 'reported', 'text'],
        colModel: [
            {name: 'agentId', index: 'agentId', width: 80, align: 'right', formatter:"number"},
            {name: 'date', index: 'date', width: 80, align: 'right', formatter:"date"},
            {name: 'deleted', index: 'deleted', width: 150, sortable: true
                , formatter: function myformatter(cellvalue, options, rowObject) {
                if (cellvalue) {
                    return "<p>Rejected</p>";
                }
                return "<button class='reject_question' style='height: 20px;width: 100px'>Reject</button>";
            }
            },
            {name: 'id', index: 'id', width: 55,formatter:"number"},
            {name: 'questionId', index: 'questionId', width: 90,formatter:"number"},
            {name: 'rating', index: 'rating', width: 150, sortable: false,formatter:"number"},
            {name: 'reported', index: 'reported', width: 150, sortable: false},
            {name: 'text', index: 'text', width: 80, align: 'right'}
        ], height: "100%" });

Function code for adding data:

function addData (rowId) {                
            var ansTable = $("#discuss_table_answers");
            ansTable.clearGridData(true);

            $.getJSON("review2-admin/question/" + rowId + "/answers", function (data) {
                console.log(data);
                console.log(data['list'].length);
                ansTable.setGridParam({data: data}).trigger('reloadGrid');
            });

From firebug i see that I got a proper answer from the server:

{"size":2,"list":[{"id":15,"questionId":9,"agentId":7327516,"text":"лоол","date":1364882946000,"reported":false,"deleted":false,"rating":0},{"id":12,"questionId":9,"agentId":4405127,"text":"456456456","date":1364793241000,"reported":false,"deleted":false,"rating":2}]}

So the problem is that data got from server not displayed in the grid.

I tried to use test data like var testData = [ {list: {agentId: "7327516", date: "1364882946000", deleted: false, id: "15", questionId: "9", rating: "0", reported: false, text: "лоол"}, size: 1} ]; and it worked fine, table got refreshed.

Upvotes: 0

Views: 2345

Answers (1)

Mark
Mark

Reputation: 3123

To have jqGrid handle the JSON itself and trasmit a parameter as part of it's request you can do the following:

get rid of the jsonReader section

Add the following parameters to your jqGrid setup 

 datatype: 'json',
 mtype: 'POST', 
 url: '/Controller/ActionReturningJSONData'

Any time you want to change the parameter that jqGrid will send when it looks for data (via a page, reload, etc) you can call:

$('#gridName').jqGrid('setGridParam', { postData: { ValueName: Value }});

Then on your controller you just evaluate the "ValueName" parameter to change the dataset you are providing back to the jqGrid. This should be a lot less messier then handing the JSON outside of the jqGrid.

Upvotes: 1

Related Questions