Gallery

Modules

Documentation

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 development preview (gallery-paginator-dev-preview) on cdn

Last Updated: 04/11/12

+ 2 -

Luke Smith

YUI Contributor

See 19 more by this user.

Created: 04/11/12
Last CDN Push: 04/26/12
Build Tag: gallery-2012.04.26-15-49
Project: YUI 3
License: YUI BSD
YUI Version: 3.5.0
Free for use.

Preview of the Y.Paginator widget in development for the next version of YUI (currently 3.6.0 is in development).

Currently it is rather skeletal, but has the core attributes and architectural structure that will likely persist (with few if any modifications) until its release. The UI is unpolished, and the default View only knows how to display first page, previous page, next page, and last page links as well as a numbered link list for direct page access. E.g.

_first_ _previous_ _1_ _2_ _3_ _4_ _5_ _next_ _last_

The view is configurable, though.

Download
Docs
Homepage
Bugs
Source
Example
Forum
History

Render a standalone Paginator with page 2 set as the current page. Subscribe to is pageChange event to trigger loading new content into a page element from a web service.

The dev preview Paginator needs the following CSS file linked in the source:
http://lsmith.github.com/yui3-gallery/build/gallery-paginator-dev-preview/assets/skins/sam/gallery-paginator-dev-preview.css

Code Sample

<script src="http://yui.yahooapis.com/3.5.0/build/yui/yui-min.js"></script>

YUI({
    //Last Gallery Build of this module
    gallery: 'gallery-2012.04.26-15-49'
}).use('gallery-paginator-dev-preview', function(Y) {
 
    var paginator = new Y.Paginator({
        totalItems: 100,
        itemsPerPage: 20,
        page: 2
    });
 
    paginator.render('#over-there');
 
    paginator.after('pageChange', function (e) {
        Y.one('#content').load('/service/?page=' + e.newVal);
    });
 
});