Enable Only Horizontal Pager

Environment

Product Version 2019.3.1023
Product Grid for Progress® Kendo UI®

Description

What is the best way to set the pager's appearance to be shown only as horizontally? How can I make it so the Grid's pager doesn't change?

Solution

The pager can be set to always display as horizontal by changing the pageable.responsive property to false.

      $("#grid").kendoGrid({
        pageable: {
          responsive: false
        },
       //...
      });

Example

    <div id="grid"></div>
    <script>
      $("#grid").kendoGrid({
        columns: [
          { field: "productName" },
          { field: "category" }
        ],
        dataSource: [
          { productName: "Tea", category: "Beverages" },
          { productName: "Coffee", category: "Beverages" },
          { productName: "Ham", category: "Food" },
          { productName: "Bread", category: "Food" }
        ],
        pageable: {
          pageSize: 2,
          responsive: false
        }
      });
    </script>

See Also

In this article
Not finding the help you need? Improve this article