webgui/www/extras/yui/docs/YAHOO.widget.Paginator.ui.PageLinks.html
JT Smith 20f8df1291 upgrading to YUI 2.6
data tables are going to need some work yet, but the other stuff seems to be working 100%
2008-10-22 23:53:29 +00:00

1218 lines
58 KiB
HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>API: paginator YAHOO.widget.Paginator.ui.PageLinks (YUI Library)</title>
<link rel="stylesheet" type="text/css" href="assets/api.css">
<script type="text/javascript" src="assets/api-js"></script>
<script type="text/javascript" src="assets/ac-js"></script>
</head>
<body id="yahoo-com">
<div id="doc3" class="yui-t2">
<div id="hd">
<a href="http://developer.yahoo.com/yui/"><h1>Yahoo! UI Library</h1></a>
<h3>paginator&nbsp; <span class="subtitle">2.6.0</span></h3>
<p>
<a href="./index.html">Yahoo! UI Library</a>
&gt; <a href="./module_paginator.html">paginator</a>
&gt; YAHOO.widget.Paginator.ui.PageLinks
</p>
</div>
<div id="bd">
<div id="yui-main">
<div class="yui-b">
<form name="yui-classopts-form">
<span id="classopts"><input type="checkbox" name="showprivate" id="showprivate" /> <label for="showprivate">Show Private</label></span>
<span id="classopts"><input type="checkbox" name="showprotected" id="showprotected" /> <label for="showprotected">Show Protected</label></span>
<span id="classopts"><input type="checkbox" name="showdeprecated" id="showdeprecated" /> <label for="showdeprecated">Show Deprecated</label></span>
</form>
<h2>
Class <b>YAHOO.widget.Paginator.ui.PageLinks</b>
<span class="extends">
</span>
<span class="extends">
</span>
</code>
</h2>
<!-- class tree goes here -->
<div class="summary description">
ui Component to generate the page links
</div>
<div class="section constructor details">
<h3 id="constructor">Constructor</h3>
<div class="content">
<div class="detail">
<strong>YAHOO.widget.Paginator.ui.PageLinks</strong>
<code>
(
p
)
</code>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>p
&lt;Pagintor&gt;
</code>
Paginator instance to attach to
</dd>
</dl>
</div>
</div>
</div>
</div>
<div class="section field details">
<h3 id="properties">Properties</h3>
<div class="content">
<div class="private">
<h4><a name="property_container">container</a>
<code>- private HTMLElement</code>
</h4>
<div class="detail">
<div class="description">
Span node containing the page links
</div>
</div>
<hr />
</div>
<div class="private">
<h4><a name="property_current">current</a>
<code>- private number</code>
</h4>
<div class="detail">
<div class="description">
Current page
</div>
</div>
<hr />
</div>
</div>
</div>
<div class="section method details">
<h3 id="methods">Methods</h3>
<div class="content">
<div class="">
<h4>
<a name="method_calculateRange">calculateRange</a></h4>
<div class="detail">
<code>
static
Array
<strong>calculateRange</strong>
(
currentPage
,
totalPages
,
numPages
)
</code>
<div class="description">
Calculates start and end page numbers given a current page, attempting
to keep the current page in the middle
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>currentPage &lt;int&gt;</code>
The current page
</dd>
<dd>
<code>totalPages &lt;int&gt;</code>
(optional) Maximum number of pages
</dd>
<dd>
<code>numPages &lt;int&gt;</code>
(optional) Preferred number of pages in range
</dd>
</dl>
<dl>
<dt>Returns:
<code>
Array
</code></dt>
<dd>[start_page_number, end_page_number]</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="private">
<h4>
<a name="method_destroy">destroy</a></h4>
<div class="detail">
<code>
private
void
<strong>destroy</strong>
(
)
</code>
<div class="description">
Removes the page links container node and clears event listeners
</div>
<div class="description">
<dl>
<dt>Returns:
<code>
void
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="method_init">init</a></h4>
<div class="detail">
<code>
static
void
<strong>init</strong>
(
p
)
</code>
<div class="description">
Decorates Paginator instances with new attributes. Called during
Paginator instantiation.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>p &lt;Paginator&gt;</code>
Paginator instance to decorate
</dd>
</dl>
<dl>
<dt>Returns:
<code>
void
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="method_onClick">onClick</a></h4>
<div class="detail">
<code>
void
<strong>onClick</strong>
(
e
)
</code>
<div class="description">
Listener for the container's onclick event. Looks for qualifying link
clicks, and pulls the page number from the link's page attribute.
Sends link's page attribute to the Paginator's setPage method.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>e &lt;DOMEvent&gt;</code>
The click event
</dd>
</dl>
<dl>
<dt>Returns:
<code>
void
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="method_rebuild">rebuild</a></h4>
<div class="detail">
<code>
void
<strong>rebuild</strong>
(
e
)
</code>
<div class="description">
Force a rebuild of the page links.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>e &lt;CustomEvent&gt;</code>
The calling change event
</dd>
</dl>
<dl>
<dt>Returns:
<code>
void
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="method_render">render</a></h4>
<div class="detail">
<code>
HTMLElement
<strong>render</strong>
(
id_base
)
</code>
<div class="description">
Generate the nodes and return the container node containing page links
appropriate to the current pagination state.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>id_base &lt;string&gt;</code>
used to create unique ids for generated nodes
</dd>
</dl>
<dl>
<dt>Returns:
<code>
HTMLElement
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="method_update">update</a></h4>
<div class="detail">
<code>
void
<strong>update</strong>
(
e
)
</code>
<div class="description">
Update the links if appropriate
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>e &lt;CustomEvent&gt;</code>
The calling change event
</dd>
</dl>
<dl>
<dt>Returns:
<code>
void
</code></dt>
<dd></dd>
</dl>
</div>
</div>
<hr />
</div>
</div>
</div>
<div class="section method details">
<h3 id="events">Events</h3>
<div class="content">
<div class="">
<h4>
<a name="event_beforeCurrentPageClassChange">beforeCurrentPageClassChange</a></h4>
<div class="detail">
<code>
<strong>beforeCurrentPageClassChange</strong>
(
event
)
</code>
<div class="description">
Fires before the value for the configuration attribute 'currentPageClass' changes. Return false to cancel the attribute change.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_beforePageLabelBuilderChange">beforePageLabelBuilderChange</a></h4>
<div class="detail">
<code>
<strong>beforePageLabelBuilderChange</strong>
(
event
)
</code>
<div class="description">
Fires before the value for the configuration attribute 'pageLabelBuilder' changes. Return false to cancel the attribute change.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_beforePageLinkClassChange">beforePageLinkClassChange</a></h4>
<div class="detail">
<code>
<strong>beforePageLinkClassChange</strong>
(
event
)
</code>
<div class="description">
Fires before the value for the configuration attribute 'pageLinkClass' changes. Return false to cancel the attribute change.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_beforePageLinksChange">beforePageLinksChange</a></h4>
<div class="detail">
<code>
<strong>beforePageLinksChange</strong>
(
event
)
</code>
<div class="description">
Fires before the value for the configuration attribute 'pageLinks' changes. Return false to cancel the attribute change.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_beforePageLinksContainerClassChange">beforePageLinksContainerClassChange</a></h4>
<div class="detail">
<code>
<strong>beforePageLinksContainerClassChange</strong>
(
event
)
</code>
<div class="description">
Fires before the value for the configuration attribute 'pageLinksContainerClass' changes. Return false to cancel the attribute change.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_currentPageClassChange">currentPageClassChange</a></h4>
<div class="detail">
<code>
<strong>currentPageClassChange</strong>
(
event
)
</code>
<div class="description">
Fires when the value for the configuration attribute 'currentPageClass' changes.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_pageLabelBuilderChange">pageLabelBuilderChange</a></h4>
<div class="detail">
<code>
<strong>pageLabelBuilderChange</strong>
(
event
)
</code>
<div class="description">
Fires when the value for the configuration attribute 'pageLabelBuilder' changes.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_pageLinkClassChange">pageLinkClassChange</a></h4>
<div class="detail">
<code>
<strong>pageLinkClassChange</strong>
(
event
)
</code>
<div class="description">
Fires when the value for the configuration attribute 'pageLinkClass' changes.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_pageLinksChange">pageLinksChange</a></h4>
<div class="detail">
<code>
<strong>pageLinksChange</strong>
(
event
)
</code>
<div class="description">
Fires when the value for the configuration attribute 'pageLinks' changes.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
<div class="">
<h4>
<a name="event_pageLinksContainerClassChange">pageLinksContainerClassChange</a></h4>
<div class="detail">
<code>
<strong>pageLinksContainerClassChange</strong>
(
event
)
</code>
<div class="description">
Fires when the value for the configuration attribute 'pageLinksContainerClass' changes.
</div>
<div class="description">
<dl>
<dt>Parameters:</dt>
<dd>
<code>event &lt;{oldValue: any, newValue: any}&gt;</code>
An object containing the previous attribute value and the new value.
</dd>
</dl>
</div>
</div>
<hr />
</div>
</div>
</div>
<div class="section field details">
<h3 id="configattributes">Configuration Attributes</h3>
<div class="content">
<div class="">
<h4><a name="config_currentPageClass">currentPageClass</a>
<code>- object</code>
</h4>
<div class="detail">
<div class="description">
CSS class assigned to the current page span.
</div>
</div>
<div class="default">
Default Value: 'yui-pg-current-page'
</div>
<hr />
</div>
<div class="">
<h4><a name="config_pageLabelBuilder">pageLabelBuilder</a>
<code>- object</code>
</h4>
<div class="detail">
<div class="description">
Function used generate the innerHTML for each page link/span. The
function receives as parameters the page number and a reference to the
paginator object.
</div>
</div>
<div class="default">
Default Value: function (page, paginator) { return page; }
</div>
<hr />
</div>
<div class="">
<h4><a name="config_pageLinkClass">pageLinkClass</a>
<code>- object</code>
</h4>
<div class="detail">
<div class="description">
CSS class assigned to each page link/span.
</div>
</div>
<div class="default">
Default Value: 'yui-pg-page'
</div>
<hr />
</div>
<div class="">
<h4><a name="config_pageLinks">pageLinks</a>
<code>- object</code>
</h4>
<div class="detail">
<div class="description">
Maximum number of page links to display at one time.
</div>
</div>
<div class="default">
Default Value: 10
</div>
<hr />
</div>
<div class="">
<h4><a name="config_pageLinksContainerClass">pageLinksContainerClass</a>
<code>- object</code>
</h4>
<div class="detail">
<div class="description">
CSS class assigned to the span containing the page links.
</div>
</div>
<div class="default">
Default Value: 'yui-pg-pages'
</div>
<hr />
</div>
</div>
</div>
</div>
</div>
<div class="yui-b">
<div class="nav">
<div class="module">
<h4>Modules</h4>
<ul class="content">
<li class=""><a href="module_animation.html">animation</a></li>
<li class=""><a href="module_autocomplete.html">autocomplete</a></li>
<li class=""><a href="module_button.html">button</a></li>
<li class=""><a href="module_calendar.html">calendar</a></li>
<li class=""><a href="module_carousel.html">carousel</a></li>
<li class=""><a href="module_charts.html">charts</a></li>
<li class=""><a href="module_colorpicker.html">colorpicker</a></li>
<li class=""><a href="module_connection.html">connection</a></li>
<li class=""><a href="module_container.html">container</a></li>
<li class=""><a href="module_cookie.html">cookie</a></li>
<li class=""><a href="module_datasource.html">datasource</a></li>
<li class=""><a href="module_datatable.html">datatable</a></li>
<li class=""><a href="module_dom.html">dom</a></li>
<li class=""><a href="module_dragdrop.html">dragdrop</a></li>
<li class=""><a href="module_editor.html">editor</a></li>
<li class=""><a href="module_element.html">element</a></li>
<li class=""><a href="module_event.html">event</a></li>
<li class=""><a href="module_get.html">get</a></li>
<li class=""><a href="module_history.html">history</a></li>
<li class=""><a href="module_imagecropper.html">imagecropper</a></li>
<li class=""><a href="module_imageloader.html">imageloader</a></li>
<li class=""><a href="module_json.html">json</a></li>
<li class=""><a href="module_layout.html">layout</a></li>
<li class=""><a href="module_logger.html">logger</a></li>
<li class=""><a href="module_menu.html">menu</a></li>
<li class="selected"><a href="module_paginator.html">paginator</a></li>
<li class=""><a href="module_profiler.html">profiler</a></li>
<li class=""><a href="module_profilerviewer.html">profilerviewer</a></li>
<li class=""><a href="module_resize.html">resize</a></li>
<li class=""><a href="module_selector.html">selector</a></li>
<li class=""><a href="module_slider.html">slider</a></li>
<li class=""><a href="module_tabview.html">tabview</a></li>
<li class=""><a href="module_treeview.html">treeview</a></li>
<li class=""><a href="module_uploader.html">uploader</a></li>
<li class=""><a href="module_yahoo.html">yahoo</a></li>
<li class=""><a href="module_yuiloader.html">yuiloader</a></li>
<li class=""><a href="module_yuitest.html">yuitest</a></li>
</ul>
</div>
<div class="module">
<h4>Classes</h4>
<ul class="content">
<li class=""><a href="YAHOO.widget.Paginator.html">YAHOO.widget.Paginator</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.CurrentPageReport.html">YAHOO.widget.Paginator.ui.CurrentPageReport</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.FirstPageLink.html">YAHOO.widget.Paginator.ui.FirstPageLink</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.LastPageLink.html">YAHOO.widget.Paginator.ui.LastPageLink</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.NextPageLink.html">YAHOO.widget.Paginator.ui.NextPageLink</a></li>
<li class="selected"><a href="YAHOO.widget.Paginator.ui.PageLinks.html">YAHOO.widget.Paginator.ui.PageLinks</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.PreviousPageLink.html">YAHOO.widget.Paginator.ui.PreviousPageLink</a></li>
<li class=""><a href="YAHOO.widget.Paginator.ui.RowsPerPageDropdown.html">YAHOO.widget.Paginator.ui.RowsPerPageDropdown</a></li>
</ul>
</div>
<div class="module">
<h4>Files</h4>
<ul class="content">
<li class=""><a href="CurrentPageReport.js.html">CurrentPageReport.js</a></li>
<li class=""><a href="FirstPageLink.js.html">FirstPageLink.js</a></li>
<li class=""><a href="LastPageLink.js.html">LastPageLink.js</a></li>
<li class=""><a href="NextPageLink.js.html">NextPageLink.js</a></li>
<li class=""><a href="PageLinks.js.html">PageLinks.js</a></li>
<li class=""><a href="Paginator.js.html">Paginator.js</a></li>
<li class=""><a href="PreviousPageLink.js.html">PreviousPageLink.js</a></li>
<li class=""><a href="RowsPerPageDropDown.js.html">RowsPerPageDropDown.js</a></li>
</ul>
</div>
<div class="module">
<h4>Properties</h4>
<ul class="content">
<li class="private"><a href="#property_container">container</a>
<!--<code>&lt;number&gt;</code>-->
</li>
<li class="private"><a href="#property_current">current</a>
<!--<code>&lt;number&gt;</code>-->
</li>
</ul>
</div>
<div class="module">
<h4>Methods</h4>
<ul class="content">
<li class=""><!--<code>Array</code>-->
<a href="#method_calculateRange">calculateRange</a>
</li>
<li class="private"><!--<code>void</code>-->
<a href="#method_destroy">destroy</a>
</li>
<li class=""><!--<code>void</code>-->
<a href="#method_init">init</a>
</li>
<li class=""><!--<code>void</code>-->
<a href="#method_onClick">onClick</a>
</li>
<li class=""><!--<code>void</code>-->
<a href="#method_rebuild">rebuild</a>
</li>
<li class=""><!--<code>HTMLElement</code>-->
<a href="#method_render">render</a>
</li>
<li class=""><!--<code>void</code>-->
<a href="#method_update">update</a>
</li>
</ul>
</div>
<div class="module">
<h4>Events</h4>
<ul class="content">
<li class="">
<a href="#event_beforeCurrentPageClassChange">beforeCurrentPageClassChange</a>
</li>
<li class="">
<a href="#event_beforePageLabelBuilderChange">beforePageLabelBuilderChange</a>
</li>
<li class="">
<a href="#event_beforePageLinkClassChange">beforePageLinkClassChange</a>
</li>
<li class="">
<a href="#event_beforePageLinksChange">beforePageLinksChange</a>
</li>
<li class="">
<a href="#event_beforePageLinksContainerClassChange">beforePageLinksContainerClassChange</a>
</li>
<li class="">
<a href="#event_currentPageClassChange">currentPageClassChange</a>
</li>
<li class="">
<a href="#event_pageLabelBuilderChange">pageLabelBuilderChange</a>
</li>
<li class="">
<a href="#event_pageLinkClassChange">pageLinkClassChange</a>
</li>
<li class="">
<a href="#event_pageLinksChange">pageLinksChange</a>
</li>
<li class="">
<a href="#event_pageLinksContainerClassChange">pageLinksContainerClassChange</a>
</li>
</ul>
</div>
<div class="module">
<h4>Configuration Attributes</h4>
<ul class="content">
<li class="">
<a href="#config_currentPageClass">currentPageClass</a>
</li>
<li class="">
<a href="#config_pageLabelBuilder">pageLabelBuilder</a>
</li>
<li class="">
<a href="#config_pageLinkClass">pageLinkClass</a>
</li>
<li class="">
<a href="#config_pageLinks">pageLinks</a>
</li>
<li class="">
<a href="#config_pageLinksContainerClass">pageLinksContainerClass</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div id="ft">
<hr />
Copyright &copy; 2008 Yahoo! Inc. All rights reserved.
</div>
</div>
</body>
</html>