Grid page change event

3 Answers 5927 Views
Grid
Danish
Top achievements
Rank 1
Danish asked on 10 Feb 2012, 02:43 PM
Hi,

There doest not seem to be an event associated with page change. Is there any way I can figure out if a page change has occurred with information such as current page etc ?

Regards,
Danish
Danish
Top achievements
Rank 1
commented on 13 Feb 2012, 08:09 AM

Any suggestions?

3 Answers, 1 is accepted

Sort by
0
Alexander Valchev
Telerik team
answered on 13 Feb 2012, 09:31 AM
Hi Danish,

 dataBound event is fired when page changes. You can get current page index with page() method of the grid's dataSource.

$("#grid").data("kendoGrid").dataSource.page();

Greetings,
Alexander Valchev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Bob
Top achievements
Rank 1
commented on 20 Feb 2015, 09:26 PM

dataBound is fired after the page changes right? I know there is a new dataBinding, I assume the first too. With remote/ajax datasource, does dataBinding fire before the ajax query, or after but before the result is applied to the datasource object?

Bottom line, I want to know when the user said to change the page, but before any of the existing data is destroyed. Basically, I wan't to autoSave and dirty rows in an editable grid when the user pages.

thanks.
Alexander Valchev
Telerik team
commented on 25 Feb 2015, 11:12 AM

Hello Bob,

There are two different events - DataBound and DataBinding. The first one fires after the Ajax data is received and after the Grid rows are rendered in the DOM. The second one fires after the Ajax data is received but before Grid rows are rendered.

DataBound will fire after the page changes. DataBinding will fire before the page changes.

Bottom line, I want to know when the user said to change the page, but before any of the existing data is destroyed.

You need the dataBinding event.

Regards,
Alexander Valchev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Lindon
Top achievements
Rank 1
answered on 27 Nov 2014, 11:08 AM
try this!

http://docs.telerik.com/kendo-ui/api/javascript/ui/pager#events-change

var grid = $('#test_grid').data('kendoGrid');
var pager = grid.pager;
pager.bind('change', test_pagechange);
 
function test_pagechange(e){
    console.log(e);
}
0
Bridge24
Top achievements
Rank 1
Iron
answered on 27 Nov 2015, 06:50 PM

There's a secret "undocumented" feature of the kendo grid, that is:

$('#grid').kendoGrid({
pageable: {
  pageSize: 2,
  change: function(e){alert('pager change event');}
}
The "change" event of the pageable property is not in the grid documentation, but it works!  

Tags
Grid
Asked by
Danish
Top achievements
Rank 1
Answers by
Alexander Valchev
Telerik team
Lindon
Top achievements
Rank 1
Bridge24
Top achievements
Rank 1
Iron
Share this question
or