First, we will check Paging Overview and Basic Examples about the paging in SMART datagrid.
The data which will be displayed in each page is no need to all exist in the data set. In particular, you can implement the paging by storing the data just for one page and always loading to display it whenever the page location is changed. When load the data, it will always remove all the existing one and reload the data rows aligning with the page start location.
function loadData(start) {
// Remove all the existing rows,
dataset.clearRows();
// and reload aligning with the page location.
$.ajax({
url: "/data/path/dataset.csv",
success: function (data) {
DataLudi.loadCsvData(dataset, data, {
quoted: true,
start: 1 + start,
count: 10
});
}
});
}
And, reload the data when change the page location.
setPage: function (page) {
var size = grdMain.pageSize();
// Always get from the first row.
grdMain.setPageAndOffset(page, -page * size);
loadData(page * size);
}
Or, you can also load the data in the event handler of the page location.
grid.onPageIndexChanged = function (grid, oldPage, newPage) {
loadData(grdMain.pageSize() * newPage);
};
Load the data from onPageIndexChanged if checked.
Display DATA_INDEX rather than ROW_INDEX in RowIndicator if checked.