• Register
  • Log In
  • Home
  • Quick Start
    • Configurator
    • Download YUI 3
  • Documentation
    • User Guides
    • Examples
    • API Docs
    • Environments
    • Tutorials
  • Community
    • Gallery
    • Blog
    • Forums
    • YUI Theater
    • Calendar
  • Contribute
    • YUI on GitHub »
    • File a Ticket
    • View Tickets
    • Dashboard
  • Other Projects
    • Shifter »
    • Yogi »
    • YUI 2
    • YUI Doc »
    • YUI Test
    • YUI Website
    • YUI Compressor »
    • YUI Builder »
    • YUI PHP Loader
    • Grid Builder »
    • Skin Builder »
  • YUI
  • >
  • Community
  • >
  • Gallery

Gallery

Modules

  • Home
  • Featured
  • Popular
  • New
  • All

Documentation

  • Yogi Documentation
  • Shifter Documentation
  • Developer Guide
  • Module Setup

Tag Cloud

Context Navigation

    YUI Library is not responsible for bugs or support with this module. It is available as a free service. For support please contact the module owner with the provided links.

    Paginator Port (gallery-paginator) on cdn

    Last Updated: 04/7/13
    + 1 -

    John Lindal

    YUI Contributor

    See 50 more by this user.

    Created: 01/27/10
    Last CDN Push: 09/26/12
    Build Tag: gallery-2012.09.26-20-36
    Project: YUI 3
    License: YUI BSD
    YUI Version: 3.5.1
    Free for use.

    This is an unofficial port of YUI2 Paginator.

    • Tags:
    • paginator
    • pagination
    • jafl
    • Download
    • Docs
    • Homepage
    • Bugs
    • Source
    • Example
    • Forum
    • History

    The code sample instantiates two paginators. The first one uses the defaults. The second one specifies a custom template and custom appearance for some of the components in the template.

    Code Sample

    <script src="http://yui.yahooapis.com/3.5.1/build/yui/yui-min.js"></script>
    YUI({
        //Last Gallery Build of this module
        gallery: 'gallery-2012.09.26-20-36'
    }).use('gallery-paginator', function(Y)
    {
    	function update(
    		/* object */	state)
    	{
    		this.setPage(state.page, true);
    		this.setRowsPerPage(state.rowsPerPage, true);
    	}
     
    	var p1 = new Y.Paginator(
    	{
    		totalRecords: 25,
    		rowsPerPage:5
    	});
    	p1.on('changeRequest', update, p);
    	p1.render('#pg1');
     
    	var p2 = new Y.Paginator(
    	{
    		totalRecords: 25,
    		rowsPerPage:5,
    		template: '{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {ItemRangeDropdown} {NextPageLink} {LastPageLink}',
    		firstPageLinkLabel:    '|<',
    		previousPageLinkLabel: '<',
    		nextPageLinkLabel:     '>',
    		lastPageLinkLabel:     '>|'
    	});
    	p2.on('changeRequest', update, p);
    	p2.render('#pg2');
     
    });

    Forum Posts

    Subject Author Date
    Using Paginator Port with DataTable Peter Peterson 11/15/11
    Re: Using Paginator Port with DataTable John Lindal 11/16/11
    Re: Using Paginator Port with DataTable Peter Peterson 11/16/11
    Re: Using Paginator Port with DataTable John Lindal 11/16/11
    setState does not work. mark.kharitonov 09/20/12
    How can I add rowsPerPageOption 'all'? mark.kharitonov 09/20/12
    Render the same paginator above and below the same table. mark.kharitonov 09/20/12
    Re: setState does not work. John Lindal 09/20/12
    Re: How can I add rowsPerPageOption 'all'? John Lindal 09/20/12
    Re: Render the same paginator above and below the same table John Lindal 09/20/12

    © 2006-2013 Yahoo! Inc. All rights reserved.
    All code on this site is licensed under the BSD License unless stated otherwise.
    About This Site · Security Contact Info