Documentation for Pager?

2 posts, 0 answers
  1. Jesse
    Jesse avatar
    4 posts
    Member since:
    Apr 2012

    Posted 24 Apr 2012 Link to this post

    I'm using a ListView in my page, and since upgrading to 2012.1 it's working! However, I can't find any documentation on kendoPager. Right now, the paging is the default: hyperlinks to individual pages in list elements. Can pager use templates? Can I change it to arrow buttons for next and previous page? What are its events, methods, configuration?

    Thank you!
  2. Dimo
    Admin
    Dimo avatar
    8482 posts

    Posted 25 Apr 2012 Link to this post

    Hi Jesse,

    The Kendo UI pager widget accepts the following initialization options:

    $("#pager").kendoPager({
         dataSource: dataSource,
         selectTemplate: '<li><span class="k-state-active">#=text#</span></li>',
         linkTemplate: '<li><a href="\\#" class="k-link" data-#=ns#page="#=idx#">#=text#</a></li>',
         buttonCount: 10,
         change: function(e){
               alert(e.index);
         }
     
    });

    Above you are seeing the default values of the selectTemplate, linkTemplate and buttonCount properties.

    + ns (namespace) is a string value that can be set via kendo.ns to distinguish between identical data attributes of different Javascript frameworks
    + idx is the page index
    + text is the text that the user can see on the corresponding page button. Currently it renders the page index

    Since the pager is rendered inside a <ul> element, you cannot remove the <li> tags from the templates.

    Starting from the next internal build, the Kendo Pager will have a change event with the page index as event argument, fired when the user pages.

    The pager provides the following methods:

    totalPages()
    pageSize()
    page() - returns the current page

    You can use next / prev buttons outside the pager templates and cause a paging action manually with

    $("#pager").data("kendoPager").dataSource.page( 3 );

    Greetings,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top