Paging in SMART datagrid Grid, is implemented by displaying the rows of specific number from the specific location rather than the entire rows of DataSet connected to the grid.
In this example, it will implement the paging in the simplest way. If specify the size of the page through GridView.setPaging method after loading the data, the entire page number will be determined internally and the specified row number will be displayed in the grid.
var count = parseInt($('#edtPageCount').val());
grdMain.setPaging(true, 10, isNaN(count) ? -1 : count);
If the paging state is changed, in other words, if start a new paging or cancel the paging, onPaged event will be fired.
grdMain.onPaged = function (grid, paged) {
$('#pagePanel').toggle(paged);
};
After this, you will be able to move from page to page through GridView.pageIndex property. onPageIndexChanging event will be fired before change the page, and onPageIndexChanged event will be fired after change the page. If explicitly return false in the event handler before the change, it will not move.
Page Size: Page Count:
After changing the page, you can inform the user of the page location by changing the active status of page movement buttons in the event.
grdMain.onPageIndexChanged = function (grid, newPage, oldPage) {
var count = grdMain.pageCount();
$('#btnFirst').prop('disabled', newPage <= 0);
$('#btnPrev').prop('disabled', newPage <= 0);
$('#btnNext').prop('disabled', newPage >= count - 1);
$('#btnLast').prop('disabled', newPage >= count - 1);
};
If the size of the page is changed, GridView.onPageCountChanged event will be fired.