New to Kendo UI for jQuery? Start a free 30-day trial

AdaptiveMode

configuration

Specifies a value whether the page sizes dropdown will be adaptive. Possible values are:

none - The pager will not be adaptive.
auto - The page sizes dropdown will be adaptive and on small devices an action sheet will be displayed.

adaptiveMode

String

Default: "none"

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

    dataSource.read();

    $("#pager").kendoPager({
      adaptiveMode: "auto",
      dataSource: dataSource
    });
</script>
<style>
  #pager{
   margin-top: 100px;
  }
</style>