How to show all rows in the jqGrid?
Asked Answered
D

15

47

jqGrid exposes a property rowNum where you can set the number of rows to display for each page. How do you set the grid to just display ALL rows?

Right now I'm just setting the rowNum to something really high like <%= int.MaxValue %> but I'm wondering if there is a better way.

Dispeople answered 6/8, 2009 at 5:22 Comment(2)
We also use a high number. You can make this value a flag and have your server ignore paging when seen.Shippen
#2224570Stamper
D
53

In the latest version of jqGrid, you can set rowNum to -1 to instruct the grid to always display all rows:

rowNum: -1

See the latest jqGrid documentation here.

Specifically:

Sets how many records we want to view in the grid. This parameter is passed to the url for use by the server routine retrieving the data. Note that if you set this parameter to 10 (i.e. retrieve 10 records) and your server return 15 then only 10 records will be loaded. Set this parameter to -1 (unlimited) to disable this checking.


Update

Unfortunately this behavior was broken in jqGrid 3.6.3. According to this post from Tony:

Yes, this is true. The reason is the new introduced scroll:1. In the future we will correct this behavior.

So the jqGrid developers are aware of this problem and apparently are planning to fix it in a future release. Unfortunately this post was from over a year ago...

At this time, all I can recommend is that you set rowNum to a very large number to simulate the behavior of -1.


You can also try whatispunk's solution below of using rowNum: ''. However, I tried this on a grid containing local data (loadonce: true). When attemping to sort the rows all of the grid's local data would disappear. So this solution does not seem to work for grids with local data, unless this defect has been fixed in a later version of jqGrid (I tested it on jqGrid 3.8.2). If you have feedback, please post a comment below!


Update - April 16, 2014

According to the jqGrid team this is now fixed:

I have added support to set different display values on pager select box including -1 for all.

I have not had a chance to test to confirm the fix, though. Presumably this change will be in the next release after jqGrid 4.6.0.

Dutybound answered 13/10, 2009 at 2:50 Comment(4)
If you set rowNum: '' you get all rows.Grandsire
@Justin, the crossouts in this answer are confusing, and your "valid solution" comment is hidden. I recommend un-crossing out your crossout! :)Cannula
The crossed-out portion of my answer is no longer valid which is why it was crossed-out. I think it would be even more confusing to restore it. I could just delete it, but then the valid answer would be out-of-context because I would have to explain how originally -1 was used to achieve this solution. I don't know... probably the right thing to do it completely rewrite this answer along those lines.Dutybound
It's got a nasty bug when -1, if there is one record using a local array, the grid is empty.Laryngotomy
B
10

jqgrid (3.5 anyway) doesn't seem to have an elegant built in way to do this. The best I have found so far is to add something like the following to your grid options:

rowList:[10,20,30,100000000],
loadComplete: function() {
    $("option[value=100000000]").text('All');
},

Where the 100000000 is some arbitrarily higher number than the maximum # of rows you will ever return, and the option[value=] line is so your user interface looks a little nicer. Jenky, but works for me.

Bumper answered 10/10, 2009 at 17:43 Comment(0)
C
5

This works:

// Step1 - defines the rows
jqGridOptions.rowList =[10, 50, 100, 500, 'All'];
...
...
// Step2 - Change the 'All' to a meaningful value 
loadComplete: function (data) {
   $(".ui-pg-selbox option[value='All']").val(1000);
}
Cristinacristine answered 28/11, 2013 at 1:46 Comment(0)
D
4

if you dont wish to use paging at all then change you server side code to simply return all the rows. dont use the rows parameter at all.

if you want to have the rowlist but also have an option to show all then do something like this in the grid properties

jQuery("#statement_mods").jqGrid({
  rowList:['ALL',30,50,100,200]
});

and then in the serverside code make sure that you ignore the rows parameter if GET['rows']='ALL'

Dotti answered 11/8, 2009 at 15:48 Comment(1)
Kind of works but, I get "View NaN - NaN of 577" in the bottom right cornerAdiathermancy
C
4

setting rowNum:-1 did the trick for me

Condorcet answered 26/1, 2016 at 16:51 Comment(0)
B
2

If you have set the pagination on the navbar, you can also access to the total number of rows written on the right-bottom of the grid and then append to the generated RowList option.

Do something like :

    // Get the total number of rows and delete space between numbers (Split the content of the div depending of the language (for me french)

var val=jQuery("#pager_right div").text().split('sur')[jQuery("#pager_right div").text().split('sur').length-1].split(' ').join('');

    // And do the appending if the option isn't already added

if(!$(".ui-pg-selbox option[value='"+val+"']").length > 0)
    jQuery(".ui-pg-selbox").append($('<option></option>').val(val).html(val));
Bremer answered 6/12, 2012 at 15:20 Comment(0)
G
1

Setting rowNum: '' you get all rows.

Grandsire answered 24/8, 2011 at 16:49 Comment(0)
N
1
Jqgrid.PagerSettings.PageSize = Max Row you want to display;
Jqgrid.ToolBarSettings.ToolBarPosition = ToolBarPosition.Hidden;
Nitrile answered 24/5, 2012 at 5:6 Comment(0)
A
1

I've got this working:

$('#bla').jqGrid({
        ...
        'rowNum'      : 0,
        'loadOnce'    : true,
        'loadComplete': function(data) {
            $(this).jqGrid('setGridParam', 'rowNum', data.total);
        },
        ...
});

This works with and without the loadOnce option set to true. Note that you have to set the rowNum option to 0 first, if you leave out this option it'll still default to the 20 records to show. Also, I'm assuming you're returning the total rows from the server in the documented JSON reader format.

Ambuscade answered 5/9, 2013 at 10:15 Comment(1)
data.total is usually the total number of pages. It's the y of "Page x of y". data.records is the total number of returned records, regardless of how many you're displaying. It's the y of "View x-z of y". You want to use data.records.Winner
A
1

resolved it with simple change: rowNum: inputDataArray.length

where inputDataArray is the array that I am providing to the Grid.

Acupuncture answered 27/12, 2013 at 19:7 Comment(0)
H
1

By default the JQ grid show 20 rows Max ,if you are using not using pagination:

// To over come with this problem ,you can just write the bold    mark
   (rowNum:10000,):
   $("#MasterDataDefinationGrid").jqGrid({
            url: 'FetchData.aspx/GetDataFromDB',
            datatype: 'json',
            mtype: 'POST',
            height: 300,
            autowidth: true,
            serializeGridData: function (postData) {
                return JSON.stringify(postData);
            },
            ajaxGridOptions: { contentType: "application/json" },
            loadonce: true,
            colNames: [Your column names],
            colModel: [Your model],
            formatter: 'actions',
            pager: '#MasterDataDefinationPager', pgbuttons: false,pgtext:false,
            multiselect: false,
            ignoreCase: true,
            **rowNum: 10000,**
            loadtext: 'Loading ...',
            gridview: true,
            hidegrid: false,
            jsonReader: {
                page: function (obj) { return 1; },
                total: function (obj) { return 1; },
                records: function (obj) { return obj.d.length; },
                root: function (obj) { return obj.d; },
                repeatitems: false,
                id: "0"
            },
            caption: 'Data'
        });
Haworth answered 28/1, 2016 at 5:31 Comment(0)
C
0

You can also go into jquery.jqGrid.js and change "rowNum:20" to "rowNum:Some-Really-Large-Number". When you define your jqGrid, don't specify rowNum. Then return your entire dataset back to jqGrid.

Cultivation answered 10/8, 2009 at 2:39 Comment(0)
A
0

Even if it still appears in the doc that you cannot set rowNum to -1 as of jqGrid 4.5.4 it works again (maybe in earlier version too).

Anomalism answered 15/10, 2013 at 8:33 Comment(0)
W
0
loadComplete: function (data) {
                //set our "ALL" select option to the actual number of found records
                $(".ui-pg-selbox option[value='ALL']").val(data.records);
}

This changes the "ALL" option to the actual number of records in the dataset.

Winner answered 17/7, 2018 at 15:52 Comment(0)
M
0

Setting rowNum:-1 works for me like, after that it was showing all records but it still has row number option in grid footer like this:

enter image description here

To remove this I just added a css option display none by getting the sector in jquery. Like this

$('#id_tableCell').css('display', 'none');

Note: This css setting should be done when the grid load is completed.

Molder answered 3/6, 2021 at 9:18 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.