pageSizes Boolean|Array (default: false)

If set to true the pager will display a drop-down which allows the user to pick a page size. By default the page size drop-down is not displayed.

Can be set to an array of predefined page sizes to override the default list. A special all value is supported. It sets the page size to the total number of records.

If a pageSize setting is provided for the data source then this value will be selected initially.

Example - show the page size drop-down with default values

<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
    });

    $("#pager").kendoPager({
      dataSource: dataSource,
      pageSizes: true
    });

    dataSource.read();
</script>
<style>
  #pager {
   margin-top: 100px;
  }
</style>

Example - show the page size drop-down with custom values

<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
    });

    $("#pager").kendoPager({
      dataSource: dataSource,
      pageSizes: [2, 3, 4, "all"]
    });

    dataSource.read();
</script>
<style>
  #pager {
   margin-top: 100px;
  }
</style>