Page 1 of 0 even if jqgrid contains data

Question

I am using addRowData to append the data to grid in ajax call.It displays the data correctly but on pagination it shows Page 1 0f 0 which is incorrect.

I have added rowNum:10 in jqgrid table property.

$.ajax({
     url: 'getData',
     dataType: 'json',
     success: function (data) {
                $('#grid').jqGrid('clearGridData');
                for (var i = 0; i <= data.length; i++){
                                $("#grid").jqGrid('addRowData', i + 1, data[i]);
                            }
                $('#grid').setGridParam({rowNum:$('#grid').getGridParam('rowNum')});   

                }
        });

Jqgrid table is -

$("#grid").jqGrid(
                {
                    width : 'auto',
                    height : 'auto',
                    colNames : [ 'First Name', 'Last Name'],
                    colModel : [ {
                        name : "firstName",
                        index : "firstName",
                        key:true,
                        width : 120,                                                    
                        search : true,
                        stype : "text"
                    }, {
                        name : "lastName",
                        index : "lastName",
                        width : 120,                                                    
                        search : true,
                        stype : "text"
                    },
                    multiselect : false,
                    iconSet: "fontAwesome",
                    datatype : "local", 
                    loadonce : true,                            
                    rowNum : 10,        
                    rowList : [ 10, 20, 30, 100000000 ],
                    loadtext : '', 
                    loadui : 'disable',
                    toppager:true,
                    pager : '#prowed2',
                    viewrecords : true,
                    loadComplete : function() {
                        $("option[value=100000000]").text('All');
                    },
                    gridComplete : function() {
                    }

                });

I expect data to be shown and pagination should display Page 1 of 1

score 0 · Answer 1 · answered Jan 26 '19 at 11:11

0

First of all you should never fill addRowData in the loop to fill the grid. jqGrid, which has datatype: "local" supports data parameter for creating the grid and filling it with data. Seconds, it you want to display all the data at one page (which is bad idea in case of large number of rows) then you can use rowNum to large enough value, for example, 1000, which will be interpreted as maximum of rows, which will be displayed on the page.

To replace full data in existing grid you can replace data and trigger reloadGrid event. To replace the data I'd recommend to use getGridParam instead of usage setGridParam. The method getGridParam without parameters returns the reference to all internal grid parameters. So to replace data parameters you need to change the data property of the internal grid parameter object:

$.ajax({
    url: 'getData',
    dataType: 'json',
    success: function (data) {
        var $grid = $("#grid"),
            p = $grid.jqGrid("getGridParam"); // get reference to all parameters

        p.data = data; // replace data parameter
        $grid.trigger("reloadGrid", { page: 1 }); // display new data in the grid
    }
});

answered Jan 26 '19 at 11:11

Oleg

220,925
34
403
798

I have tried the solution given by you but still it is not working.Now I am not even able to see the data in the grid.It showa Page 1 0f 0 with no data.Please suggest – Stack_User Jan 26 '19 at 13:23
@Stack_User: You should post more information about the grid, which you create. For example, if you use TreeGrid, then you should follow [the answer](https://stackoverflow.com/a/52935507/315935), which uses `populate` method instead of `reloadGrid`. In general, you should always include information about **the version** of jqGrid, which you use (or can use) and **the fork** ([free jqGrid](https://github.com/free-jqgrid/jqGrid), commercial [Guriddo jqGrid JS](http://guriddo.net/?page_id=103334) or an old jqGrid in version <=4.7). Your code, which creates jqGrid and test data are important too. – Oleg Jan 26 '19 at 13:47
I have edited my ans provided jqgrid table defination.I am using free jqgrid.Here I am not using tree jqgrid its a simple jqgrid table – Stack_User Jan 26 '19 at 14:40
@Stack_User: You made an error in your tests. You can verify on the demo https://jsfiddle.net/OlegKi/xegtnq2u/ that the approach, which I described in my answer works. Click on "Set 1" or "Set 2" buttons to reload the data in the grid. – Oleg Jan 26 '19 at 18:05

Page 1 of 0 even if jqgrid contains data

1 Answers1