change

Fires when the current page has changed.

Event Data

e.sender kendo.ui.Grid

The widget instance which fired the event.

Example - subscribe to the "change" event during initialization

<div id="pager"></div>

<script>
    var dataSource = new kendo.data.DataSource({
      data: [
        { productName: "Tea", category: "Beverages" },
        { productName: "Coffee", category: "Beverages" },
        { productName: "Ham", category: "Food" },
        { productName: "Bread", category: "Food" }
      ],
      pageSize: 2
    });

    dataSource.read();

    $("#pager").kendoPager({
      dataSource: dataSource,
      change: function() {
/* The result can be observed in the DevTools(F12) console of the browser. */
        console.log("pager change event");
      }
    });
</script>
<style>
  #pager {
   margin-top: 100px;
  }
</style>

Example - subscribe to the "change" event after initialization

<div id="pager"></div>

<script>
    function pager_change() {
/* The result can be observed in the DevTools(F12) console of the browser. */
      console.log("pager change event");
    }

    var dataSource = new kendo.data.DataSource({
      data: [
        { productName: "Tea", category: "Beverages" },
        { productName: "Coffee", category: "Beverages" },
        { productName: "Ham", category: "Food" },
        { productName: "Bread", category: "Food" }
      ],
      pageSize: 2
    });

    dataSource.read();

    var pager = $("#pager").kendoPager({
      dataSource: dataSource
    }).data("kendoPager");

    pager.bind("change", pager_change);
</script>
<style>
  #pager {
   margin-top: 100px;
  }
</style>