Search code examples
kendo-gridkendo-asp.net-mvc

Kendo Grid pager buttons


there is an option in the grid pageable.previousNext

If set to true the pager will display buttons for going to the first, previous, next and last pages. By default those buttons are displayed.

My question is: Is there a way to display only next and last buttons? If i set it false it hides all the buttons, and true display them.

Reading the source code it doesn't look like there is an option in kendo, don't know if you guy know a work around?

<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,
    previousNext: false
  }
});
</script>

Thanks, Henry


Solution

  • The pager link contains following classes.

    k-pager-first - class on first page link k-pager-last - class on last page link

    classes on all other page links

    k-pager-numbers

    - data-page="2"
    - data-page="3"
    

    etc

    You can user jQuery, and disable links you don't want user to use.

    not very elegant but should work.