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

Pager

Directive

kendo-pager

Props

auto-bind Boolean

Indicates whether the refresh method of the Pager will be called during its initialization (autoBind in Kendo UI for jQuery).

button-count Number

The number of buttons that are displayed in the numeric Pager (buttonCount in Kendo UI for jQuery).

data-source Object

An instance of the Kendo UI DataSource (dataSource in Kendo UI for jQuery. The setting of the data-source option is mandatory because the Pager manages paging over the DataSource and also gets values, such as the page size and the total count of items, from the DataSource.

select-template String

The template for the link of the selected page number (selectTemplate in Kendo UI for jQuery).

The template for the links of the page numbers (linkTemplate in Kendo UI for jQuery).

info Boolean

Defines if the label which shows the current paging information will be displayed (info in Kendo UI for jQuery).

input Boolean

Defines if an input element which allows the user to navigate to a given page will be displayed (input in Kendo UI for jQuery).

numeric Boolean

Defines if a numeric portion of the Pager will be shown (numeric in Kendo UI for jQuery).

page-sizes Boolean | Array

If page-sizes is set to true, the Pager will display a drop-down list which will allow the user to pick a page size (pageSizes in Kendo UI for jQuery). By default, the drop-down list for the page size is not displayed. To override the default list, set page-sizes to an array of predefined page sizes. If page-sizes is set to all, the page size will be set to the total number of records. If a pageSize setting is provided for the data source, then the page-sizes value will be initially selected.

previous-next Boolean

Defines if the Pager will display buttons for navigating to the first or last, previous or next pages (previousNext in Kendo UI for jQuery).

refresh Boolean

Defines if the Pager will display a Refresh button (refresh in Kendo UI for jQuery). Clicking on the Refresh button will call the read() method of the DataSource to get the actual data.

responsive Boolean

Defines if the pager will be responsive (responsive in Kendo UI for jQuery).

messages Object

Defines the texts that will be displayed within the Pager (messages in Kendo UI for jQuery). Used for customization and localization of the Pager messages. The supported composite props are available in MessagesProps.

Events

change: Function

Fires when the current page was changed (change in Kendo UI for jQuery).

Methods

For more details about the methods available in the component's API please check its Kendo UI for jQuery API documentation.

kendoWidget

returns

Returns the Kendo UI Pager instance.