Paging links beyond 28 or 36 pages is not showing up.

[ZafarMember]

Hi All,

I just run custom paging example at this link.

http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxgrid/jquery-grid-paging.htm

If I change loop value from 100 to 400 to generate 400 pages, I cannot see paging links beyond 270 pages. i.e I see only 0-26 links.

In another scenario, in my application, I cannot see paging beyond 360 pages.

How can I fix this please, so I can have links to all pages loaded in the grid.

Thanks,
Zafar

[Peter StoevKeymaster]

Hi Zafar,

The sample in the help topic shows how to override the built-in pager renderer. The sample adds Anchor tag for each page. If there’s not enough space for all Anchor tags, you will not see them. I suppose that an approach with an Input field for entering the page number will be more appropriate in your scenario.

Best regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[ZafarMember]

Hi Peter,

Thanks so much for the quick answer.

Also I am looking at possibility of using virtual data paging, if it runs same on android phone or tablet.

I just run the sample example but with my inputs. I could not figure out why it is not loading. Could you please help?

FYI, JsobObject is returned from server. It can 10-200000 records. Thanks so much!!

In this demo jqxGrid uses a virtualized paging which enables you to handle very large data sets without any impact on client side performance.

$(document).ready(function () {
var theme = getTheme();
// prepare the data
var data = new Array();
var jsonObject = { “contactList”:[

{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},
{“age”:1,”SId”:”S1234567″,”gender”:”male”},

], “totalrecords”:9};

//alert(“jsonObject.totalrecords : ” + jsonObject.totalrecords);

// generate sample data.
var generatedata = function (startindex, endindex) {
var data = {};
for (var i = startindex; i < endindex; i++) {

//alert(startindex + " " + endindex);
var row = {};

row["age"] = jsonObject.contactList[i].age;
row["gender"] = jsonObject.contactList[i].gender;
row["SId"] = jsonObject.contactList[i].SId;

data[i] = row;
}
return data;
}
var source =
{
datatype: "array",
localdata: {},
totalrecords: jsonObject.totalrecords
};

// load virtual data.
var rendergridrows = function (params) {

alert("rendergridrows : " + source.totalrecords);
//alert("rendergridrows : " + params.startindex + " " + params.endindex);
var data = generatedata(params.startindex, params.endindex);
return data;
}
var totalcolumnrenderer = function (row, column, cellvalue) {
var cellvalue = $.jqx.dataFormat.formatnumber(cellvalue, 'c2');
return '‘ + cellvalue + ”;
}
var dataAdapter = new $.jqx.dataAdapter(source);
$(“#jqxgrid”).jqxGrid(
{
width: 670,
autoheight: true,
source: dataAdapter,
theme: theme,
virtualmode: true,
pageable: true,
rendergridrows: rendergridrows,
columns: [

{ text: ‘Age’, datafield: ‘age’, width: 50 },
{ text: ‘SId’, datafield: ‘SId’, width: 120 },
{ text: ‘Gender’, datafield: ‘gender’, width: 80 },

]
});
});

[Author]

Posts