Free jqGrid 4.8.0 - Hidding the 'of X' in the pager bar where it says 'page Y ox X'

Question

In continues to this great answer, I'm looking got a way to remove the "of X" part that is part of the pager 'page Y of X'.

So in case I'm working in a streaming mode, where I only know there is one more page ahead, without knowing how many real pages are waiting up front, I would prefer not to show "of X" which is not the true, but to only show the current page number.

Is there a built-in way I can show only the current page plus the next arrow?

Thanks,

Answer 1

All texts which you see in the grid can be localized. The corresponding templates come from grid.locale-XX.js files. You can open grid.locale-en.js file for example and search for page. You will find the property pgtext: "Page {0} of {1}" inside of defaults part ($.jgrid.defaults). The defaults settings are just the same options of jqGrid, but there are moved in locale files grid.locale-XX.js because of language specific texts.

Thus you can just add the option pgtext: "Page {0}" to jqGrid. There are one small problem in free jqGrid 4.8. It get all options (even the defaults part) from local file only. I fixed the behavior in the current code on GitHub. So you should refresh the sources which you use. Alternatively you can set the option in the way

$.jgrid.defaults.pgtext = "Page {0}";

The demo uses the the last sources from GitHub (https://rawgit.com/free-jqgrid/jqGrid) and so it can use just pgtext: "Page {0}". It display the pager like on the picture below

More interesting is the scenario which we discuss with you in comment to your previous question. You wanted to return the data from the grid first and to get the information about the total number of records and pages later via separate Ajax call. The reason was: you need to get COUNT(*) from SELECT which produces very large results. Because of that getting one page is more quickly as getting COUNT(*). In the scenario you want first hide the total number of records and to show the value later after the Ajax call for COUNT(*) will be finished. Using the scenario it would be consequent to hide the "of X'" part of the pager at the beginning and to show it later after the Ajax request for COUNT(*) will be finished.

I would suggest to use the following option

pgtext: "Page {0}<span class='pagerOf' style='display:none'> of {1}</span>"

in the scenario. The option will have the required information in the pager, but the information will be hidden initially. The {1} part pf the pager will be replaced with <span> having id which will be built based on the pager id using sp_1_ prefix. It will allow you to show or to hide the "of ..." part of the pager any time.

The next demo demonstrates the approach. It has two buttons which allows to show/hide the "of ..." part of the pager dynamically. You can use the same code inside of Ajax requests which you make. The last demo uses the following code

var getPagerOf = function (grid) {
    var p = grid.jqGrid("getGridParam"), sel = [];
    if (p.pager) {
        sel.push("#sp_1_" + p.pager.substr(1));
    }
    if (p.toppager) {
        sel.push("#sp_1_" + p.toppager.substr(1));
    }
    return $(sel.join()).closest(".pagerOf");
}
$("#showOfPager").button().click(function () {
    getPagerOf($grid).show();
});
$("#hideOfPager").button().click(function () {
    getPagerOf($grid).hide();
});