Revision: 4153
Author: scottgonzalez
Date: Sat Sep 29 09:23:39 2012
Log: Fixed docs.
http://code.google.com/p/jquery-ui/source/detail?r=4153
Modified:
/tags/1.8.24/docs/accordion.html
/tags/1.8.24/docs/addClass.html
/tags/1.8.24/docs/animate.html
/tags/1.8.24/docs/autocomplete.html
/tags/1.8.24/docs/button.html
/tags/1.8.24/docs/datepicker.html
/tags/1.8.24/docs/dialog.html
/tags/1.8.24/docs/draggable.html
/tags/1.8.24/docs/droppable.html
/tags/1.8.24/docs/effect-blind.html
/tags/1.8.24/docs/effect-bounce.html
/tags/1.8.24/docs/effect-clip.html
/tags/1.8.24/docs/effect-drop.html
/tags/1.8.24/docs/effect-explode.html
/tags/1.8.24/docs/effect-fade.html
/tags/1.8.24/docs/effect-fold.html
/tags/1.8.24/docs/effect-highlight.html
/tags/1.8.24/docs/effect-puff.html
/tags/1.8.24/docs/effect-pulsate.html
/tags/1.8.24/docs/effect-scale.html
/tags/1.8.24/docs/effect-shake.html
/tags/1.8.24/docs/effect-size.html
/tags/1.8.24/docs/effect-slide.html
/tags/1.8.24/docs/effect-transfer.html
/tags/1.8.24/docs/effect.html
/tags/1.8.24/docs/hide.html
/tags/1.8.24/docs/position.html
/tags/1.8.24/docs/progressbar.html
/tags/1.8.24/docs/removeClass.html
/tags/1.8.24/docs/resizable.html
/tags/1.8.24/docs/selectable.html
/tags/1.8.24/docs/show.html
/tags/1.8.24/docs/slider.html
/tags/1.8.24/docs/sortable.html
/tags/1.8.24/docs/switchClass.html
/tags/1.8.24/docs/tabs.html
/tags/1.8.24/docs/toggle.html
/tags/1.8.24/docs/toggleClass.html
=======================================
--- /tags/1.8.24/docs/accordion.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/accordion.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,1021 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/API/1.8/Accordion - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Options</a></li>
+<li><a href="#events">Events</a></li>
+<li><a href="#methods">Methods</a></li>
+<li><a href="#theming">Theming</a></li>
+</ul>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI Accordion</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <p>Make the selected elements Accordion widgets. Semantic
requirements:</p>
+<p>The markup of your accordion container needs pairs of headers and
content panels:</p>
+<pre><div id="accordion">
+ <h3><a href="#">First header</a></h3>
+ <div>First content</div>
+ <h3><a href="#">Second
header</a></h3>
+ <div>Second content</div>
+</div></pre>
+<p>If you use a different element for the header, specify the
header-option with an appropriate selector, eg. header: 'a.header'. The
content element must be always next to its header.</p>
+<p>If you have links inside the accordion content and use a-elements as
headers, add a class to them and use that as the header, eg.
header: 'a.header'.</p>
+<p>Use activate(Number) to change the active content programmatically.</p>
+<h4> <span class="mw-headline"
id="NOTE:_If_you_want_multiple_sections_open_at_once.2C_don.27t_use_an_accordion">NOTE:
If you want multiple sections open at once, don't use an
accordion</span></h4>
+<p>An accordion doesn't allow more than one content panel to be open at
the same time, and it takes a lot of effort to do that. If you are looking
for a widget that allows more than one content panel to be open, don't use
this. Usually it can be written with a few lines of jQuery instead,
something like this:</p>
+<pre>jQuery(document).ready(function(){
+ $('.accordion .head').click(function() {
+ $(this).next().toggle();
+ return false;
+ }).next().hide();
+});</pre>
+<p>Or animated:</p>
+<pre>jQuery(document).ready(function(){
+ $('.accordion .head').click(function() {
+ $(this).next().toggle('slow');
+ return false;
+ }).next().hide();
+});</pre>
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>UI Core</li>
+<li>UI Widget</li>
+<li>UI Effects Core (Optional - only for non-default animations)</li>
+</ul>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="310">
+A simple jQuery UI Accordion.<br />
+</p>
+<pre>$("#accordion").accordion();
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("#accordion").accordion();
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<div id="accordion">
+ <h3><a href="#">Section 1</a></h3>
+ <div>
+ <p>
+ Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
+ ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
+ amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
+ odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque
vulputate.
+ </p>
+ </div>
+ <h3><a href="#">Section 2</a></h3>
+ <div>
+ <p>
+ Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
+ purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis
porttitor
+ velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
+ suscipit faucibus urna.
+ </p>
+ </div>
+ <h3><a href="#">Section 3</a></h3>
+ <div>
+ <p>
+ Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque
lobortis.
+ Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac
libero
+ ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
+ lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis
dui.
+ </p>
+ <ul>
+ <li>List item one</li>
+ <li>List item two</li>
+ <li>List item three</li>
+ </ul>
+ </div>
+ <h3><a href="#">Section 4</a></h3>
+ <div>
+ <p>
+ Cras dictum. Pellentesque habitant morbi tristique senectus et netus
+ et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
+ faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
+ mauris vel est.
+ </p>
+ <p>
+ Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat
lectus.
+ Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
+ inceptos himenaeos.
+ </p>
+ </div>
+</div>
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/API/1.8/Accordion","wgTitle":"Action/render/UI/API/1.8/Accordion","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/API/1.8/Accordion","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Options</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-disabled">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-disabled">disabled</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Disables (true) or enables (false) the accordion. Can be set when
initialising (first creating) the accordion.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>disabled</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ disabled: true });</code></pre>
+</dd>
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_API_1_8_Accordion skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
+
+<dt>
+ Get or set the <code>disabled</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var disabled = $( ".selector" ).accordion( "option", "disabled" );
+//setter
+$( ".selector" ).accordion( "option", "disabled", true );</code></pre>
+</dd>
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
+ </dl>
+ </div>
+</li>
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
- <h1>Documentation</h1>
+<li class="option" id="option-active">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-active">active</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Selector, Element, jQuery, Boolean,
Number</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">first child</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Selector for the active element. Set to false to display none at
start. Needs <code>collapsible: true</code>.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>active</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ active: 2 });</code></pre>
+</dd>
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
+
+<dt>
+ Get or set the <code>active</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var active = $( ".selector" ).accordion( "option", "active" );
+//setter
+$( ".selector" ).accordion( "option", "active", 2 );</code></pre>
+</dd>
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
-</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
-</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/API/1.8/Accordion" title="A
list of all wiki pages that link here [j]" accesskey=j>What links here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/API/1.8/Accordion&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/API/1.8/Accordion?redlink=1" title="View the
content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/API/1.8/Accordion?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /NAMESPACES -->
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
+<li class="option" id="option-animated">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-animated">animated</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean, String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"slide"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Choose your favorite animation, or disable them (set to false). In
addition to the default, 'bounceslide' and all defined easing methods are
supported ('bounceslide' requires UI Effects Core).</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>animated</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ animated: 'bounceslide'
});</code></pre>
+</dd>
-<!-- /ACTIONS -->
+
+<dt>
+ Get or set the <code>animated</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var animated = $( ".selector" ).accordion( "option", "animated" );
+//setter
+$( ".selector" ).accordion( "option", "animated", 'bounceslide'
);</code></pre>
+</dd>
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FAPI%2F1.8%2FAccordion"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/API/1.8/Accordion</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/API/1.8/Accordion"
title="Special:Search/Action/render/UI/API/1.8/Accordion">search for this
page title</a> in other pages, or <span class="plainlinks"><a rel=nofollow
class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/API/1.8/Accordion">search
the related logs</a></span>, but you do not have permission to create this
page.
+
+<li class="option" id="option-autoHeight">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-autoHeight">autoHeight</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">true</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>If set, the highest content part is used as height reference for
all other parts. Provides more consistent animations.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>autoHeight</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ autoHeight: false });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>autoHeight</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var autoHeight = $( ".selector" ).accordion( "option", "autoHeight" );
+//setter
+$( ".selector" ).accordion( "option", "autoHeight", false );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-clearStyle">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-clearStyle">clearStyle</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>If set, clears height and overflow styles after finishing
animations. This enables accordions to work with dynamic content. Won't
work together with autoHeight.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>clearStyle</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ clearStyle: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>clearStyle</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var clearStyle = $( ".selector" ).accordion( "option", "clearStyle" );
+//setter
+$( ".selector" ).accordion( "option", "clearStyle", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-collapsible">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-collapsible">collapsible</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Whether all the sections can be closed at once. Allows collapsing
the active section by the triggering event (click is the default).</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>collapsible</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ collapsible: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>collapsible</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var collapsible = $( ".selector" ).accordion( "option", "collapsible" );
+//setter
+$( ".selector" ).accordion( "option", "collapsible", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-event">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-event">event</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"click"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The event on which to trigger the accordion.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>event</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ event: 'mouseover' });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>event</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var event = $( ".selector" ).accordion( "option", "event" );
+//setter
+$( ".selector" ).accordion( "option", "event", 'mouseover' );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-fillSpace">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-fillSpace">fillSpace</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>If set, the accordion completely fills the height of the parent
element. Overrides autoheight.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>fillSpace</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ fillSpace: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>fillSpace</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var fillSpace = $( ".selector" ).accordion( "option", "fillSpace" );
+//setter
+$( ".selector" ).accordion( "option", "fillSpace", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-header">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-header">header</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Selector, jQuery</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"> li
> :first-child,> :not(li):even"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Selector for the header element.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>header</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ header: 'h3' });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>header</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var header = $( ".selector" ).accordion( "option", "header" );
+//setter
+$( ".selector" ).accordion( "option", "header", 'h3' );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-icons">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-icons">icons</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Object</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">{ "header":
"ui-icon-triangle-1-e", "headerSelected":
"ui-icon-triangle-1-s" }</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Icons to use for headers. Icons may be specified for 'header'
and 'headerSelected', and we recommend using the icons native to the jQuery
UI CSS Framework manipulated by <a rel=nofollow class="external text"
href="
http://www.themeroller.com">jQuery UI ThemeRoller</a>. Set to false
to have no icons displayed.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>icons</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ icons: { "header":
"ui-icon-plus", "headerSelected":
"ui-icon-minus" } });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>icons</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var icons = $( ".selector" ).accordion( "option", "icons" );
+//setter
+$( ".selector" ).accordion( "option", "icons", { "header":
"ui-icon-plus", "headerSelected":
"ui-icon-minus" } );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-navigation">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-navigation">navigation</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>If set, looks for the anchor that matches location.href and
activates it. Great for href-based state-saving. Use navigationFilter to
implement your own matcher.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>navigation</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ navigation: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>navigation</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var navigation = $( ".selector" ).accordion( "option", "navigation" );
+//setter
+$( ".selector" ).accordion( "option", "navigation", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-navigationFilter">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-navigationFilter">navigationFilter</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Function</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default"> </dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Overwrite the default location.href-matching with your own
matcher.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a accordion with the <code>navigationFilter</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({ navigationFilter: function(){ ...
} });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>navigationFilter</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var navigationFilter = $( ".selector"
).accordion( "option", "navigationFilter" );
+//setter
+$( ".selector" ).accordion( "option", "navigationFilter", function(){ ...
} );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="events">
+ <h2 class="top-header">Events</h2>
+ <ul class="events-list">
+
+<li class="event" id="event-create">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-create">create</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">accordioncreate</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>This event is triggered when accordion is created.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>create</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({
+ create: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>create</code> event by type:
<code>accordioncreate</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "accordioncreate",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-change">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-change">change</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">accordionchange</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>This event is triggered every time the accordion changes. If the
accordion is animated, the event will be triggered upon completion of the
animation; otherwise, it is triggered immediately.
</p>
+<pre>$('.ui-accordion').bind('accordionchange', function(event, ui) {
+ ui.newHeader // jQuery object, activated header
+ ui.oldHeader // jQuery object, previous header
+ ui.newContent // jQuery object, activated content
+ ui.oldContent // jQuery object, previous content
+});</pre></p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>change</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({
+ change: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>change</code> event by type:
<code>accordionchange</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "accordionchange",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+<p>
+<li class="event" id="event-changestart">
+ <div class="event-header">
+ <h3 class="event-name"><a
href="#event-changestart">changestart</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">accordionchangestart</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>This event is triggered every time the accordion starts to change.
+</p>
+<pre>$('.ui-accordion').bind('accordionchangestart', function(event, ui) {
+ ui.newHeader // jQuery object, activated header
+ ui.oldHeader // jQuery object, previous header
+ ui.newContent // jQuery object, activated content
+ ui.oldContent // jQuery object, previous content
+});</pre></p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>changestart</code> event
as an init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).accordion({
+ changestart: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>changestart</code> event by type:
<code>accordionchangestart</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind(
"accordionchangestart", function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="methods">
+ <h2 class="top-header">Methods</h2>
+ <ul class="methods-list">
+
+<li class="method" id="method-destroy">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-destroy">destroy</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.accordion( "destroy"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Remove the accordion functionality completely. This will return the
element back to its pre-init state.</p>
+ </div>
+</li>
+
+<p>
+<li class="method" id="method-disable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-disable">disable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.accordion( "disable"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Disable the accordion.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-enable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-enable">enable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.accordion( "enable"
+
+
+
***The diff for this file has been truncated for email.***
=======================================
--- /tags/1.8.24/docs/addClass.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/addClass.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,113 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/Effects/addClass - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
-
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/Effects/addClass","wgTitle":"Action/render/UI/Effects/addClass","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/Effects/addClass","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
-
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_Effects_addClass skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
-
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
-
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
-
- <h1>Documentation</h1>
-
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
-
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Arguments</a></li>
</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI addClass</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <h3> <span class="mw-headline"
id="addClass.28_class.2C_.5Bduration.5D_.29">addClass( class, <span
class="optional">[</span>duration<span class="optional">]</span>
)</span></h3>
+<p>Adds the specified class to each of the set of matched elements with an
optional transition between the states.</p>
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>Effects Core</li>
</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/Effects/addClass" title="A
list of all wiki pages that link here [j]" accesskey=j>What links here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/Effects/addClass&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/Effects/addClass?redlink=1" title="View the
content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/Effects/addClass?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="100">
+Adds the class 'selected' to the matched elements with a one second
transition.<br />
+</p>
+<pre>$("p").<a href="
http://docs.jquery.com/Events/click"
title="Events/click">click</a>(function () {
+ $(this).<strong
class="selflink">addClass</strong>("selected", 1000);
+ });
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+ <script
src="
http://ui.jquery.com/latest/ui/effects.core.js"></script>
+<style type="text/css">
+ p { cursor: pointer; font-size: 1.2em; }
+ .selected { color:red; }
+</style>
+ <script>
+ $(document).ready(function() {
+ $("p").<a href="
http://docs.jquery.com/Events/click"
title="Events/click">click</a>(function () {
+ $(this).<strong
class="selflink">addClass</strong>("selected", 1000);
+ });
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+ <p>Click me to add a 'selected' class.</p>
+<p>Click me to add a 'selected' class.</p>
+<p>Click me to add a 'selected' class.</p>
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Arguments</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-class">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-class">class</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>One CSS class to add to the elements.</p>
+ </div>
+</li>
-<!-- /NAMESPACES -->
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
+<li class="option" id="option-duration">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-duration">duration</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String, Number</dd>
+
+ <dt class="option-optional-label">Optional</dt>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>A string representing one of the three predefined speeds
("slow", "normal", or "fast") or the number of milliseconds to run the
animation (e.g. 1000).</p>
+ </div>
+</li>
-<!-- /ACTIONS -->
-
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FEffects%2FaddClass"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
+ </ul>
+ </div>
</div>
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/Effects/addClass</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/Effects/addClass"
title="Special:Search/Action/render/UI/Effects/addClass">search for this
page title</a> in other pages, or <span class="plainlinks"><a rel=nofollow
class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/Effects/addClass">search
the related logs</a></span>, but you do not have permission to create this
page.
</p>
-</div>
-</div> <!-- /bodycontent -->
- <!-- printfooter -->
- <div class="printfooter">
- Retrieved from "<a
href="
http://docs.jquery.com/Action/render/UI/Effects/addClass">
http://docs.jquery.com/Action/render/UI/Effects/addClass</a>"
</div>
- <!-- /printfooter -->
- <!-- catlinks -->
- <div id='catlinks' class='catlinks catlinks-allhidden'></div> <!--
/catlinks -->
- <div class="visualClear"></div>
- <!-- debughtml -->
- <!-- /debughtml -->
-</div>
-<!-- /bodyContent -->
+<!--
+NewPP limit report
+Preprocessor visited node count: 249/1000000
+Preprocessor generated node count: 1177/1000000
+Post-expand include size: 6835/2097152 bytes
+Template argument size: 3941/2097152 bytes
+Highest expansion depth: 5/40
+Expensive parser function count: 0/100
+-->
- </div>
- </div>
- </div><!-- /#jq-primaryContent -->
- </div><!-- /#jq-content -->
- <div id="jq-footer" class="jq-clearfix">
- <div id="jq-credits">
- <p id="jq-copyright">© 2010 <a href="
http://jquery.org/">The jQuery
Project</a></p>
- <p id="jq-hosting">Sponsored by <a href="
http://mediatemple.net"
class="jq-mediaTemple">Media Temple</a> and <a
href="
http://jquery.org/sponsors">others</a>.</p>
- </div>
- <div id="jq-footerNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-footerNavigation -->
- </div><!-- /#jq-footer -->
-</div><!-- /#jq-siteContain -->
-<script>if(
window.mw){
-mw.loader.state({"site":"loading","user":"missing","user.groups":"ready"});
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.user","mediawiki.page.ready","skins.jqdocs.enhanced"],
null,
true);
-}</script>
-<script
src="
http://static.jquery.com/files/rocker/scripts/custom.js?303"></script>
-<script>if(
window.mw){
-mw.loader.state({"site":"ready"});
-}</script>
-<!-- Served in 0.219 secs. --></body>
-</html>
+<!-- Saved in parser cache with key
jqdocs_live:pcache:idhash:2606-1!*!0!*!*!*!* and timestamp 20120929160940
-->
=======================================
--- /tags/1.8.24/docs/animate.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/animate.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,82 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/Effects/animate - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
+<p>The jQuery UI effects core extends the <a
href="
http://docs.jquery.com/Effects/animate"
title="Effects/animate">animate</a> function to be able to animate colors
as well. It's heavily used by the class transition feature and it's able to
color animate the following properties:
+</p>
+<ul><li> <b>backgroundColor</b>
+</li><li> <b>borderBottomColor</b>
+</li><li> <b>borderLeftColor</b>
+</li><li> <b>borderRightColor</b>
+</li><li> <b>borderTopColor</b>
+</li><li> <b>color</b>
+</li><li> <b>outlineColor</b>
+</li></ul>
+<p>with one of the following combinations:
+</p>
+<ul><li> <b>hex (#FF0000)</b>
+</li><li> <b>rgb (rgb(255,255,255))</b>
+</li><li> <b>names ("black")</b>
+</li></ul>
+<p><br />
+</p><p><div class="options list"><table class="options examples"
cellspacing="0"><thead><tr><th>Name</th><th>Type</th></tr></thead><tbody>
+</table><b class="options">Example:</b><table class="options examples"
cellspacing="0"><thead><tr><th>Name</th><th>Type</th></tr></thead><tbody>
+<div class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<div id="demo" class="tabs-container" rel="125">
+A simple color animation.<br />
+</p>
+<pre>$(".block").<a href="
http://docs.jquery.com/Events/toggle"
title="Events/toggle">toggle</a>(function() {
+ $(this).<a href="
http://docs.jquery.com/Effects/animate"
title="Effects/animate">animate</a>({ backgroundColor: "black" },
1000);
+},function() {
+ $(this).<a href="
http://docs.jquery.com/Effects/animate"
title="Effects/animate">animate</a>({ backgroundColor: "#68BFEF"
}, 500);
+});
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+ "<a rel=nofollow class="external free"
href="
http://www.w3.org/TR/html4/loose.dtd">
http://www.w3.org/TR/html4/loose.dtd</a>">
+<html>
+<head>
+ <script src="<a rel=nofollow class="external free"
href="
http://code.jquery.com/jquery-latest.js">
http://code.jquery.com/jquery-latest.js</a>"></script>
+
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/Effects/animate","wgTitle":"Action/render/UI/Effects/animate","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/Effects/animate","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+ <script>
+ $(document).ready(function(){
+ $(".block").<a href="
http://docs.jquery.com/Events/toggle"
title="Events/toggle">toggle</a>(function() {
+ $(this).<a href="
http://docs.jquery.com/Effects/animate"
title="Effects/animate">animate</a>({ backgroundColor: "black" },
1000);
+},function() {
+ $(this).<a href="
http://docs.jquery.com/Effects/animate"
title="Effects/animate">animate</a>({ backgroundColor: "#68BFEF"
}, 500);
+});
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_Effects_animate skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
-
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
-
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
-
- <h1>Documentation</h1>
-
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
-
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
-</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
-</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/Effects/animate" title="A
list of all wiki pages that link here [j]" accesskey=j>What links here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/Effects/animate&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/Effects/animate?redlink=1" title="View the
content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/Effects/animate?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
-
-<!-- /NAMESPACES -->
-
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
-
-<!-- /ACTIONS -->
-
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FEffects%2Fanimate"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
-</div>
-
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/Effects/animate</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/Effects/animate"
title="Special:Search/Action/render/UI/Effects/animate">search for this
page title</a> in other pages, or <span class="plainlinks"><a rel=nofollow
class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/Effects/animate">search
the related logs</a></span>, but you do not have permission to create this
page.
+ });
+ </script>
+ <style>
+ .block {
+ color: white;
+ background-color: #68BFEF;
+ width: 150px;
+ height: 70px;
+ margin: 10px;
+ }
+ </style>
+</head>
+<body>
+ <div class="block"> Click me</div>
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+</p><p></tbody></table></div>
</p>
-</div>
-</div> <!-- /bodycontent -->
- <!-- printfooter -->
- <div class="printfooter">
- Retrieved from "<a
href="
http://docs.jquery.com/Action/render/UI/Effects/animate">
http://docs.jquery.com/Action/render/UI/Effects/animate</a>"
</div>
- <!-- /printfooter -->
- <!-- catlinks -->
- <div id='catlinks' class='catlinks catlinks-allhidden'></div> <!--
/catlinks -->
- <div class="visualClear"></div>
- <!-- debughtml -->
- <!-- /debughtml -->
-</div>
-<!-- /bodyContent -->
+<!--
+NewPP limit report
+Preprocessor visited node count: 143/1000000
+Preprocessor generated node count: 870/1000000
+Post-expand include size: 5324/2097152 bytes
+Template argument size: 3060/2097152 bytes
+Highest expansion depth: 5/40
+Expensive parser function count: 0/100
+-->
- </div>
- </div>
- </div><!-- /#jq-primaryContent -->
- </div><!-- /#jq-content -->
- <div id="jq-footer" class="jq-clearfix">
- <div id="jq-credits">
- <p id="jq-copyright">© 2010 <a href="
http://jquery.org/">The jQuery
Project</a></p>
- <p id="jq-hosting">Sponsored by <a href="
http://mediatemple.net"
class="jq-mediaTemple">Media Temple</a> and <a
href="
http://jquery.org/sponsors">others</a>.</p>
- </div>
- <div id="jq-footerNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-footerNavigation -->
- </div><!-- /#jq-footer -->
-</div><!-- /#jq-siteContain -->
-<script>if(
window.mw){
-mw.loader.state({"site":"loading","user":"missing","user.groups":"ready"});
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.user","mediawiki.page.ready","skins.jqdocs.enhanced"],
null,
true);
-}</script>
-<script
src="
http://static.jquery.com/files/rocker/scripts/custom.js?303"></script>
-<script>if(
window.mw){
-mw.loader.state({"site":"ready"});
-}</script>
-<!-- Served in 0.084 secs. --></body>
-</html>
+<!-- Saved in parser cache with key
jqdocs_live:pcache:idhash:3094-1!*!0!*!*!*!* and timestamp 20120929161859
-->
=======================================
--- /tags/1.8.24/docs/autocomplete.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/autocomplete.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,884 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/API/1.8/Autocomplete - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Options</a></li>
+<li><a href="#events">Events</a></li>
+<li><a href="#methods">Methods</a></li>
+<li><a href="#theming">Theming</a></li>
+</ul>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI Autocomplete</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <p>Autocomplete, when added to an input field, enables users to
quickly find and select from a pre-populated list of values as they type,
leveraging searching and filtering.</p>
+<p>By giving an Autocomplete field focus or entering something into it,
the plugin starts searching for entries that match and displays a list of
values to choose from. By entering more characters, the user can filter
down the list to better matches.</p>
+<p>This can be used to enter previous selected values, for example you
could use Autocomplete for entering tags, to complete an address, you could
enter a city name and get the zip code, or maybe enter email addresses from
an address book.</p>
+<p>You can pull data in from a local and/or a remote source: Local is good
for small data sets (like an address book with 50 entries), remote is
necessary for big data sets, like a database with hundreds or millions of
entries to select from.</p>
+<p>Autocomplete can be customized to work with various data sources, by
just specifying the source option. A data source can be:</p>
+<ul>
+<li>an Array with local data</li>
+<li>a String, specifying a URL</li>
+<li>a Callback</li>
+</ul>
+<p><b>Expected data format</b></p>
+<p>The data from local data, a url or a callback can come in two
variants:</p>
+<ul>
+<li>An Array of Strings:<br /><code>[ "Choice1", "Choice2" ]</code></li>
+<li>An Array of Objects with label and value properties:<br /><code>[ {
label: "Choice1", value: "value1" }, ... ]</code></li>
+</ul>
+<p>The label property is displayed in the suggestion menu. The value will
be inserted into the input element after the user selected something from
the menu. If just one property is specified, it will be used for both, eg.
if you provide only value-properties, the value will also be used as the
label.</p>
+<p>When a String is used, the Autocomplete plugin expects that string to
point to a URL resource that will return JSON data. It can be on the same
host or on a different one (must provide JSONP). The Autocomplete plugin
does not filter the results, instead the request parameter "term" gets
added to the URL, which the server-side script should use for filtering the
results. The data itself can be in the same format as the local data
described above.</p>
+<p>The third variation, the callback, provides the most flexibility, and
can be used to connect any data source to Autocomplete. The callback gets
two arguments:</p>
+<ul>
+<li>A request object, with a single property called "term", which refers
to the value currently in the text input. For example, when the user
entered "new yo" in a city field, the Autocomplete term will equal "new
yo".</li>
+<li>A response callback, which expects a single argument to contain the
data to suggest to the user. This data should be filtered based on the
provided term, and can be in any of the formats described above for simple
local data (String-Array or Object-Array with label/value/both properties).
It's important when providing a custom source callback to handle errors
during the request. You must always call the response callback even if you
encounter an error. This ensures that the widget always has the correct
state.</li>
+</ul>
+<p>The label is always treated as text, if you want the label to be
treated as html you can use <a rel=nofollow class="external text"
href="
https://github.com/scottgonzalez/jquery-ui-extensions/blob/master/autocomplete/jquery.ui.autocomplete.html.js">Scott
González' html extension</a>. The demos all focus on different variations
of the source-option - look for the one that matches your use case, and
take a look at the code.</p>
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>UI Core</li>
+<li>UI Widget</li>
+<li>UI Position</li>
+</ul>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="300">
+A simple jQuery UI Autocomplete.<br />
+</p>
+<pre>$("input#autocomplete").autocomplete({
+ source: ["c++", "java", "php",
"coldfusion", "javascript", "asp",
"ruby"]
+});
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("input#autocomplete").autocomplete({
+ source: ["c++", "java", "php",
"coldfusion", "javascript", "asp",
"ruby"]
+});
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<input id="autocomplete" />
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/API/1.8/Autocomplete","wgTitle":"Action/render/UI/API/1.8/Autocomplete","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/API/1.8/Autocomplete","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Options</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-disabled">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-disabled">disabled</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Disables (true) or enables (false) the autocomplete. Can be set
when initialising (first creating) the autocomplete.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>disabled</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ disabled: true });</code></pre>
+</dd>
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_API_1_8_Autocomplete skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
+
+<dt>
+ Get or set the <code>disabled</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var disabled = $( ".selector" ).autocomplete( "option", "disabled" );
+//setter
+$( ".selector" ).autocomplete( "option", "disabled", true );</code></pre>
+</dd>
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
+ </dl>
+ </div>
+</li>
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
- <h1>Documentation</h1>
+<li class="option" id="option-appendTo">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-appendTo">appendTo</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Selector</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"body"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Which element the menu should be appended to.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>appendTo</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ appendTo: "#someElem"
});</code></pre>
+</dd>
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
+
+<dt>
+ Get or set the <code>appendTo</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var appendTo = $( ".selector" ).autocomplete( "option", "appendTo" );
+//setter
+$( ".selector" ).autocomplete( "option", "appendTo", "#someElem"
);</code></pre>
+</dd>
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
-</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
-</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/API/1.8/Autocomplete"
title="A list of all wiki pages that link here [j]" accesskey=j>What links
here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/API/1.8/Autocomplete&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/API/1.8/Autocomplete?redlink=1" title="View
the content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/API/1.8/Autocomplete?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /NAMESPACES -->
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
+<li class="option" id="option-autoFocus">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-autoFocus">autoFocus</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>If set to true the first item will be automatically focused.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>autoFocus</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ autoFocus: true });</code></pre>
+</dd>
-<!-- /ACTIONS -->
+
+<dt>
+ Get or set the <code>autoFocus</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var autoFocus = $( ".selector" ).autocomplete( "option", "autoFocus" );
+//setter
+$( ".selector" ).autocomplete( "option", "autoFocus", true );</code></pre>
+</dd>
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FAPI%2F1.8%2FAutocomplete"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/API/1.8/Autocomplete</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/API/1.8/Autocomplete"
title="Special:Search/Action/render/UI/API/1.8/Autocomplete">search for
this page title</a> in other pages, or <span class="plainlinks"><a
rel=nofollow class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/API/1.8/Autocomplete">search
the related logs</a></span>, but you do not have permission to create this
page.
+
+<li class="option" id="option-delay">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-delay">delay</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Integer</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">300</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The delay in milliseconds the Autocomplete waits after a keystroke
to activate itself. A zero-delay makes sense for local data (more
responsive), but can produce a lot of load for remote data, while being
less responsive.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>delay</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ delay: 0 });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>delay</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var delay = $( ".selector" ).autocomplete( "option", "delay" );
+//setter
+$( ".selector" ).autocomplete( "option", "delay", 0 );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-minLength">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-minLength">minLength</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Integer</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">1</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The minimum number of characters a user has to type before the
Autocomplete activates. Zero is useful for local data with just a few
items. Should be increased when there are a lot of items, where a single
character would match a few thousand items.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>minLength</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ minLength: 0 });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>minLength</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var minLength = $( ".selector" ).autocomplete( "option", "minLength" );
+//setter
+$( ".selector" ).autocomplete( "option", "minLength", 0 );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-position">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-position">position</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Object</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">{ my: "left top", at:
"left bottom", collision: "none" }</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Identifies the position of the Autocomplete widget in relation to
the associated input element. The "of" option defaults to the input
element, but you can specify another element to position against. You can
refer to the <a rel=nofollow class="external text"
href="
http://docs.jquery.com/UI/Position">jQuery UI Position</a> utility
for more details about the various options.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>position</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ position: { my : "right
top", at: "right bottom" } });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>position</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var position = $( ".selector" ).autocomplete( "option", "position" );
+//setter
+$( ".selector" ).autocomplete( "option", "position", { my : "right
top", at: "right bottom" } );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-source">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-source">source</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String, Array, Callback</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">none, must be specified</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Defines the data to use, must be specified. See Overview section
for more details, and look at the various demos.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a autocomplete with the <code>source</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({ source: ["c++",
"java", "php", "coldfusion",
"javascript", "asp", "ruby"] });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>source</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var source = $( ".selector" ).autocomplete( "option", "source" );
+//setter
+$( ".selector" ).autocomplete( "option", "source", ["c++",
"java", "php", "coldfusion",
"javascript", "asp", "ruby"] );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="events">
+ <h2 class="top-header">Events</h2>
+ <ul class="events-list">
+
+<li class="event" id="event-create">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-create">create</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompletecreate</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>This event is triggered when autocomplete is created.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>create</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ create: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>create</code> event by type:
<code>autocompletecreate</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind(
"autocompletecreate", function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-search">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-search">search</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompletesearch</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>Before a request (source-option) is started, after minLength and
delay are met. Can be canceled (return false), then no request will be
started and no items suggested.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>search</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ search: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>search</code> event by type:
<code>autocompletesearch</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind(
"autocompletesearch", function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-open">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-open">open</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompleteopen</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>Triggered when the suggestion menu is opened.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>open</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ open: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>open</code> event by type:
<code>autocompleteopen</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "autocompleteopen",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-focus">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-focus">focus</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompletefocus</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>Before focus is moved to an item (not selecting), ui.item refers to
the focused item. The default action of focus is to replace the text
field's value with the value of the focused item, though only if the focus
event was triggered by a keyboard interaction. Canceling this event
prevents the value from being updated, but does not prevent the menu item
from being focused.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>focus</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ focus: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>focus</code> event by type:
<code>autocompletefocus</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "autocompletefocus",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-select">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-select">select</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompleteselect</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>Triggered when an item is selected from the menu; ui.item refers to
the selected item. The default action of select is to replace the text
field's value with the value of the selected item. Canceling this event
prevents the value from being updated, but does not prevent the menu from
closing.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>select</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ select: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>select</code> event by type:
<code>autocompleteselect</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind(
"autocompleteselect", function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-close">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-close">close</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompleteclose</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>When the list is hidden - doesn't have to occur together with a
change.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>close</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ close: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>close</code> event by type:
<code>autocompleteclose</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "autocompleteclose",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="event" id="event-change">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-change">change</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">autocompletechange</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>Triggered when the field is blurred, if the value has changed;
ui.item refers to the selected item.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>change</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).autocomplete({
+ change: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>change</code> event by type:
<code>autocompletechange</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind(
"autocompletechange", function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="methods">
+ <h2 class="top-header">Methods</h2>
+ <ul class="methods-list">
+
+<li class="method" id="method-destroy">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-destroy">destroy</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "destroy"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Remove the autocomplete functionality completely. This will return
the element back to its pre-init state.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-disable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-disable">disable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "disable"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Disable the autocomplete.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-enable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-enable">enable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "enable"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Enable the autocomplete.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-option">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-option">option</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "option"
+
+, optionName
+
+, <span class="optional">[</span>value<span class="optional">] </span>
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Get or set any autocomplete option. If no value is specified, will
act as a getter.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-option">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-option">option</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "option"
+
+, options
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Set multiple autocomplete options at once by providing an options
object.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-widget">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-widget">widget</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "widget"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Returns the .ui-autocomplete element.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-search">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-search">search</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "search"
+
+, <span class="optional">[</span>value<span class="optional">] </span>
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Triggers a search event, which, when data is available, then will
display the suggestions; can be used by a selectbox-like button to open the
suggestions when clicked. If no value argument is specified, the current
input's value is used. Can be called with an empty string and minLength: 0
to display all items.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-close">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-close">close</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.autocomplete( "close"
+
+
+
+
+
+
***The diff for this file has been truncated for email.***
=======================================
--- /tags/1.8.24/docs/button.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/button.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,504 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/API/1.8/Button - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Options</a></li>
+<li><a href="#events">Events</a></li>
+<li><a href="#methods">Methods</a></li>
+<li><a href="#theming">Theming</a></li>
+</ul>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI Button</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <p>Button enhances standard form elements like button, input of
type submit or reset or anchors to themable buttons with appropiate
mouseover and active styles.</p>
+<p>In addition to basic push buttons, radio buttons and checkboxes (inputs
of type radio and checkbox) can be converted to buttons: Their associated
label is styled to appear as the button, while the underlying input is
updated on click.</p>
+<p>In order to group radio buttons, Button also provides an additional
widget-method, called Buttonset. Its used by selecting a container element
(which contains the radio buttons) and calling buttonset(). Buttonset will
also provide visual grouping, and therefore should be used whenever you
have a group of buttons. It works by selecting all descendents and applying
button() to them. You can enable and disable a buttonset, which will enable
and disable all contained buttons. Destroying a buttonset also calls the
button's destroy method.</p>
+<p>When using an input of type button, submit or reset, support is limited
to plain text labels with no icons.</p>
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>UI Core</li>
+<li>UI Widget</li>
+</ul>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="300">
+A simple jQuery UI Button.<br />
+</p>
+<pre>$("button").button();
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("button").button();
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<button>Button label</button>
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/API/1.8/Button","wgTitle":"Action/render/UI/API/1.8/Button","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/API/1.8/Button","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+<div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<div id="demo" class="tabs-container" rel="300">
+A simple jQuery UI Button.<br />
+</p>
+<pre>$("#radio").buttonset();
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("#radio").buttonset();
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<div id="radio">
+ <input type="radio" id="radio1"
name="radio" /><label for="radio1">Choice
1</label>
+ <input type="radio" id="radio2"
name="radio" checked="checked" /><label
for="radio2">Choice 2</label>
+ <input type="radio" id="radio3"
name="radio" /><label for="radio3">Choice
3</label>
+</div>
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_API_1_8_Button skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Options</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-disabled">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-disabled">disabled</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Disables (true) or enables (false) the button. Can be set when
initialising (first creating) the button.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a button with the <code>disabled</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).button({ disabled: true });</code></pre>
+</dd>
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
+
+<dt>
+ Get or set the <code>disabled</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var disabled = $( ".selector" ).button( "option", "disabled" );
+//setter
+$( ".selector" ).button( "option", "disabled", true );</code></pre>
+</dd>
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
+ </dl>
+ </div>
+</li>
- <h1>Documentation</h1>
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
+<li class="option" id="option-text">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-text">text</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">true</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Whether to show any text - when set to false (display no text),
icons (see icons option) must be enabled, otherwise it'll be ignored.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a button with the <code>text</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).button({ text: false });</code></pre>
+</dd>
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
-</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
-</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/API/1.8/Button" title="A list
of all wiki pages that link here [j]" accesskey=j>What links here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/API/1.8/Button&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/API/1.8/Button?redlink=1" title="View the
content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/API/1.8/Button?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
+
+<dt>
+ Get or set the <code>text</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var text = $( ".selector" ).button( "option", "text" );
+//setter
+$( ".selector" ).button( "option", "text", false );</code></pre>
+</dd>
-<!-- /NAMESPACES -->
+ </dl>
+ </div>
+</li>
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
-<!-- /ACTIONS -->
+<li class="option" id="option-icons">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-icons">icons</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Options</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">{ primary: null, secondary: null }</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Icons to display, with or without text (see text option). The
primary icon is displayed by default on the left of the label text, the
secondary by default is on the right. Value for the primary and secondary
properties must be a classname (String), eg. "ui-icon-gear". For using only
one icon: icons: {primary:'ui-icon-locked'}. For using two icons: icons:
{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a button with the <code>icons</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).button({ icons:
{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'} });</code></pre>
+</dd>
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FAPI%2F1.8%2FButton"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
-</div>
+
+<dt>
+ Get or set the <code>icons</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var icons = $( ".selector" ).button( "option", "icons" );
+//setter
+$( ".selector" ).button( "option", "icons",
{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'} );</code></pre>
+</dd>
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/API/1.8/Button</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/API/1.8/Button"
title="Special:Search/Action/render/UI/API/1.8/Button">search for this page
title</a> in other pages, or <span class="plainlinks"><a rel=nofollow
class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/API/1.8/Button">search
the related logs</a></span>, but you do not have permission to create this
page.
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-label">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-label">label</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">HTML content of the button, or value
attribute</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Text to show on the button. When not specified (null), the
element's html content is used, or its value attribute when it's an input
element of type submit or reset; or the html content of the associated
label element if its an input of type radio or checkbox</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a button with the <code>label</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).button({ label: "custom label" });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>label</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var label = $( ".selector" ).button( "option", "label" );
+//setter
+$( ".selector" ).button( "option", "label", "custom label" );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="events">
+ <h2 class="top-header">Events</h2>
+ <ul class="events-list">
+
+<li class="event" id="event-create">
+ <div class="event-header">
+ <h3 class="event-name"><a href="#event-create">create</a></h3>
+ <dl>
+ <dt class="event-type-label">Type:</dt>
+ <dd class="event-type">buttoncreate</dd>
+ </dl>
+ </div>
+ <div class="event-description">
+ <p>This event is triggered when button is created.</p>
+ </div>
+ <div class="event-examples">
+ <h4>Code examples</h4>
+ <dl class="event-examples-list">
+
+<dt>
+ Supply a callback function to handle the <code>create</code> event as an
init option.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).button({
+ create: function(event, ui) { ... }
+});</code></pre>
+</dd>
+
+
+<dt>
+ Bind to the <code>create</code> event by type: <code>buttoncreate</code>.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).bind( "buttoncreate",
function(event, ui) {
+ ...
+});</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
</p>
+<p>There are no events for this plugin.</p>
+ </ul>
+ </div>
+ <div id="methods">
+ <h2 class="top-header">Methods</h2>
+ <ul class="methods-list">
+
+<li class="method" id="method-destroy">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-destroy">destroy</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "destroy"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Remove the button functionality completely. This will return the
element back to its pre-init state.</p>
+ </div>
+</li>
+
+<p>
+<li class="method" id="method-disable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-disable">disable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "disable"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Disable the button.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-enable">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-enable">enable</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "enable"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Enable the button.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-option">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-option">option</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "option"
+
+, optionName
+
+, <span class="optional">[</span>value<span class="optional">] </span>
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Get or set any button option. If no value is specified, will act as
a getter.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-option">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-option">option</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "option"
+
+, options
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Set multiple button options at once by providing an options
object.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-widget">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-widget">widget</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "widget"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Returns the .ui-button element.</p>
+ </div>
+</li>
+
+
+<li class="method" id="method-refresh">
+ <div class="method-header">
+ <h3 class="method-name"><a href="#method-refresh">refresh</a></h3>
+ <dl>
+ <dt class="method-signature-label">Signature:</dt>
+ <dd class="method-signature">.button( "refresh"
+
+
+
+
+
+
+
+)</dd>
+ </dl>
+ </div>
+ <div class="method-description">
+ <p>Refreshes the visual state of the button. Useful for updating
button state after the native element's checked or disabled state is
changed programatically.</p>
+ </div>
+</li>
+
+ </ul>
+ </div>
+ <div id="theming">
+ <h2 class="top-header">Theming</h2>
+ <p>The jQuery UI Button plugin uses the jQuery UI CSS Framework to
style its look and feel, including colors and background textures. We
recommend using the ThemeRoller tool to create and download custom themes
that are easy to build and maintain.
+</p>
+ <p>If a deeper level of customization is needed, there are
widget-specific classes referenced within the jquery.ui.button.css
stylesheet that can be modified. These classes are highlighed in bold below.
+</p>
+
+ <h3>Sample markup with jQuery UI CSS Framework classes</h3>
+ <button class="<strong>ui-button ui-button-text-only</strong>
ui-widget ui-state-default ui-corner-all"><br />
+   <span
class="<strong>ui-button-text</strong>">Button
Label</span><br /></button>
+ <p class="theme-note">
+ <strong>
+ Note: This is a sample of markup generated by the button plugin, not
markup you should use to create a button. The only markup needed for that
is <button>Button Label</button>.
+ </strong>
+ </p>
+
+ </div>
</div>
-</div> <!-- /bodycontent -->
- <!-- printfooter -->
- <div class="printfooter">
- Retrieved from "<a
href="
http://docs.jquery.com/Action/render/UI/API/1.8/Button">
http://docs.jquery.com/Action/render/UI/API/1.8/Button</a>"
</div>
- <!-- /printfooter -->
- <!-- catlinks -->
- <div id='catlinks' class='catlinks catlinks-allhidden'></div> <!--
/catlinks -->
- <div class="visualClear"></div>
- <!-- debughtml -->
- <!-- /debughtml -->
-</div>
-<!-- /bodyContent -->
- </div>
- </div>
- </div><!-- /#jq-primaryContent -->
- </div><!-- /#jq-content -->
- <div id="jq-footer" class="jq-clearfix">
- <div id="jq-credits">
- <p id="jq-copyright">© 2010 <a href="
http://jquery.org/">The jQuery
Project</a></p>
- <p id="jq-hosting">Sponsored by <a href="
http://mediatemple.net"
class="jq-mediaTemple">Media Temple</a> and <a
href="
http://jquery.org/sponsors">others</a>.</p>
- </div>
- <div id="jq-footerNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-footerNavigation -->
- </div><!-- /#jq-footer -->
-</div><!-- /#jq-siteContain -->
-<script>if(
window.mw){
-mw.loader.state({"site":"loading","user":"missing","user.groups":"ready"});
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.user","mediawiki.page.ready","skins.jqdocs.enhanced"],
null,
true);
-}</script>
-<script
src="
http://static.jquery.com/files/rocker/scripts/custom.js?303"></script>
-<script>if(
window.mw){
-mw.loader.state({"site":"ready"});
-}</script>
-<!-- Served in 0.135 secs. --></body>
-</html>
+</p>
+<!--
+NewPP limit report
+Preprocessor visited node count: 1193/1000000
+Preprocessor generated node count: 2885/1000000
+Post-expand include size: 32038/2097152 bytes
+Template argument size: 13611/2097152 bytes
+Highest expansion depth: 6/40
+Expensive parser function count: 0/100
+-->
+
+<!-- Saved in parser cache with key
jqdocs_live:pcache:idhash:3767-1!*!*!*!*!*!* and timestamp 20120929161858
-->
=======================================
--- /tags/1.8.24/docs/datepicker.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/datepicker.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,2536 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/API/1.8/Datepicker - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Options</a></li>
+<li><a href="#events">Events</a></li>
+<li><a href="#methods">Methods</a></li>
+<li><a href="#theming">Theming</a></li>
+</ul>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI Datepicker</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <p>The jQuery UI Datepicker is a highly configurable plugin that
adds datepicker functionality to your pages. You can customize the date
format and language, restrict the selectable date ranges and add in buttons
and other navigation options easily.</p>
+<p>By default, the datepicker calendar opens in a small overlay onFocus
and closes automatically onBlur or when a date is selected. For an inline
calendar, simply attach the datepicker to a div or span.
+</p><p>You can use keyboard shortcuts to drive the datepicker:
+</p>
+<ul>
+ <li>page up/down - previous/next month</li>
+ <li>ctrl+page up/down - previous/next year</li>
+ <li>ctrl+home - current month or open when closed</li>
+ <li>ctrl+left/right - previous/next day</li>
+ <li>ctrl+up/down - previous/next week</li>
+ <li>enter - accept the selected date</li>
+ <li>ctrl+end - close and erase the date</li>
+ <li>escape - close the datepicker without selection</li>
+</ul>
+<h3 id="utility-functions"> <span class="mw-headline"
id="Utility_functions">Utility functions</span></h3>
+<ul>
+ <li><a href="
http://docs.jquery.com/UI/Datepicker/setDefaults"
title="UI/Datepicker/setDefaults">$.datepicker.setDefaults( settings )</a>
- Set settings for all datepicker instances.</li>
+ <li><a href="
http://docs.jquery.com/UI/Datepicker/formatDate"
title="UI/Datepicker/formatDate">$.datepicker.formatDate( format, date,
settings )</a> - Format a date into a string value with a specified
format.</li>
+ <li><a href="
http://docs.jquery.com/UI/Datepicker/parseDate"
title="UI/Datepicker/parseDate">$.datepicker.parseDate( format, value,
settings ) </a> - Extract a date from a string value with a specified
format.</li>
+ <li><a href="
http://docs.jquery.com/UI/Datepicker/iso8601Week"
title="UI/Datepicker/iso8601Week">$.datepicker.iso8601Week( date )</a> -
Determine the week of the year for a given date: 1 to 53.</li>
+ <li><a href="
http://docs.jquery.com/UI/Datepicker/noWeekends"
title="UI/Datepicker/noWeekends">$.datepicker.noWeekends</a> - Set as
beforeShowDay function to prevent selection of weekends.</li>
+</ul>
+<h3> <span class="mw-headline" id="Localization">Localization</span></h3>
+<p>Datepicker provides support for localizing its content to cater for
different languages
+ and date formats. Each localization is contained within its own file with
the
+ language code appended to the name, e.g.
<code>jquery.ui.datepicker-fr.js</code> for French.
+ The desired localization file should be included after the main
datepicker code. They add their settings to the set
+ of available localizations and automatically apply them as defaults for
all instances.</p>
+<p>The <code>$.datepicker.regional</code> attribute holds an array of
localizations,
+ indexed by language code, with "" referring to the default
(English). Each entry is
+ an object with the following attributes: <code>closeText</code>,
<code>prevText</code>,
+ <code>nextText</code>, <code>currentText</code>, <code>monthNames</code>,
+ <code>monthNamesShort</code>, <code>dayNames</code>,
<code>dayNamesShort</code>,
+ <code>dayNamesMin</code>, <code>weekHeader</code>,
<code>dateFormat</code>,
+ <code>firstDay</code>, <code>isRTL</code>,
<code>showMonthAfterYear</code>,
+ and <code>yearSuffix</code>.</p>
+<p>You can restore the default localizations with:</p>
+<p><code>$.datepicker.setDefaults($.datepicker.regional[""]);</code>
+</p>
+<p>And can then override an individual datepicker for a specific
locale:</p>
+<p><code>$(selector).datepicker($.datepicker.regional['fr']);</code>
+</p>
+The localization files are included when using the <a rel=nofollow
class="external text" href="
http://jqueryui.com/download/">jQuery UI
download builder</a>.
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>UI Core</li>
+</ul>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="220">
+A simple jQuery UI Datepicker.<br />
+</p>
+<pre>$("#datepicker").datepicker();
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("#datepicker").datepicker();
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<div id="datepicker"></div>
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/API/1.8/Datepicker","wgTitle":"Action/render/UI/API/1.8/Datepicker","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/API/1.8/Datepicker","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Options</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-disabled">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-disabled">disabled</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Disables (true) or enables (false) the datepicker. Can be set when
initialising (first creating) the datepicker.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>disabled</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ disabled: true });</code></pre>
+</dd>
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_API_1_8_Datepicker skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
+
+<dt>
+ Get or set the <code>disabled</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var disabled = $( ".selector" ).datepicker( "option", "disabled" );
+//setter
+$( ".selector" ).datepicker( "option", "disabled", true );</code></pre>
+</dd>
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
+ </dl>
+ </div>
+</li>
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
- <h1>Documentation</h1>
+<li class="option" id="option-altField">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-altField">altField</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Selector, jQuery, Element</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">""</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The jQuery selector for another field that is to be updated with
the selected date from the datepicker. Use the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-altFormat"
title="UI/Datepicker" class=mw-redirect>altFormat</a></code> setting to
change the format of the date within this field. Leave as blank for no
alternate field.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>altField</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ altField: "#actualDate"
});</code></pre>
+</dd>
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
+
+<dt>
+ Get or set the <code>altField</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var altField = $( ".selector" ).datepicker( "option", "altField" );
+//setter
+$( ".selector" ).datepicker( "option", "altField", "#actualDate"
);</code></pre>
+</dd>
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery with Other
Libraries</a>
- <li id=n-Variable-Types><a href="/Types">Variable Types</a>
-</ul>
-<h5>API Reference</h5><ul>
- <li id=n-jQuery-Core><a href="/Core">jQuery Core</a>
- <li id=n-Selectors><a href="/Selectors">Selectors</a>
- <li id=n-Attributes><a href="/Attributes">Attributes</a>
- <li id=n-Traversing><a href="/Traversing">Traversing</a>
- <li id=n-Manipulation><a href="/Manipulation">Manipulation</a>
- <li id=n-CSS><a href="/CSS">CSS</a>
- <li id=n-Events><a href="/Events">Events</a>
- <li id=n-Effects><a href="/Effects">Effects</a>
- <li id=n-Ajax><a href="/Ajax">Ajax</a>
- <li id=n-Utilities><a href="/Utilities">Utilities</a>
- <li id=n-jQuery-UI><a href="/UI">jQuery UI</a>
-</ul>
-<h5>Plugins</h5><ul>
- <li id=n-Plugin-Repository><a href="
http://plugins.jquery.com/"
rel=nofollow>Plugin Repository</a>
- <li id=n-Authoring><a href="/Plugins/Authoring">Authoring</a>
-</ul>
-<h5>Support</h5><ul>
- <li id=n-Mailing-List-and-Chat><a href="/Discussion">Mailing List and
Chat</a>
- <li id=n-Submit-New-Bug><a href="
http://jquery.com/dev/bugs/new/"
rel=nofollow>Submit New Bug</a>
-</ul>
-<h5>About jQuery</h5><ul>
- <li id=n-Contributors><a href="/Contributors">Contributors</a>
- <li id=n-History-of-jQuery><a href="/History_of_jQuery">History of
jQuery</a>
- <li id=n-Getting-Involved><a href="/Getting_Involved">Getting Involved</a>
- <li id=n-Browser-Compatibility><a href="/Browser_Compatibility">Browser
Compatibility</a>
- <li id=n-Code-Style-Guidelines><a
href="/JQuery_Core_Style_Guidelines">Code Style Guidelines</a>
- <li id=n-Design-and-Logos><a href="/Design_and_Identity">Design and
Logos</a>
- <li id=n-Licensing><a href="/Licensing:">Licensing</a>
- <li id=n-Donate><a href="/Donate">Donate</a>
-</ul>
-<h5>Wiki: Navigation</h5><ul>
- <li id=n-recentchanges><a href="/Special:RecentChanges" title="A list of
recent changes in the wiki [r]" accesskey=r>Recent changes</a>
- <li id=n-randompage><a href="/Special:Random" title="Load a random page
[x]" accesskey=x>Random page</a>
-</ul>
-<h5>Wiki: Toolbox</h5><ul>
- <li id=t-whatlinkshere><a
href="/Special:WhatLinksHere/Action/render/UI/API/1.8/Datepicker" title="A
list of all wiki pages that link here [j]" accesskey=j>What links here</a>
- <li id=t-specialpages><a href="/Special:SpecialPages" title="A list of
all special pages [q]" accesskey=q>Special pages</a>
- <li id=t-print><a
href="/mw/index.php?title=Action/render/UI/API/1.8/Datepicker&printable=yes"
rel=alternate title="Printable version of this page [p]"
accesskey=p>Printable version</a>
-</ul>
- </div><!-- /#mw-panel -->
-
-<!-- NAMESPACES -->
-<div>
- <h5>Wiki: Namespaces</h5>
- <ul>
- <li id="ca-nstab-main" class="selected new"><span><a
href="/edit/Action/render/UI/API/1.8/Datepicker?redlink=1" title="View the
content page [c]" accesskey="c">Page</a></span></li>
- <li id="ca-talk" class="new"><span><a
href="/edit/Talk:Action/render/UI/API/1.8/Datepicker?redlink=1"
title="Discussion about the content page [t]"
accesskey="t">Discussion</a></span></li>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /NAMESPACES -->
-<!-- ACTIONS -->
-<div class="emptyPortlet">
- <h5>Wiki: Actions</h5>
- <ul>
- </ul>
-</div>
+<li class="option" id="option-altFormat">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-altFormat">altFormat</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">""</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-dateFormat"
title="UI/Datepicker" class=mw-redirect>dateFormat</a></code> to be used
for the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-altField"
title="UI/Datepicker" class=mw-redirect>altField</a></code> option. This
allows one date format to be shown to the user for selection purposes,
while a different format is actually sent behind the scenes. For a full
list of the possible formats see the <a
href="
http://docs.jquery.com/UI/Datepicker/formatDate"
title="UI/Datepicker/formatDate">formatDate</a> function</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>altFormat</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ altFormat: "yy-mm-dd"
});</code></pre>
+</dd>
-<!-- /ACTIONS -->
+
+<dt>
+ Get or set the <code>altFormat</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var altFormat = $( ".selector" ).datepicker( "option", "altFormat" );
+//setter
+$( ".selector" ).datepicker( "option", "altFormat", "yy-mm-dd"
);</code></pre>
+</dd>
-<!-- PERSONAL -->
-<div>
- <h5>Personal tools</h5>
- <ul>
- <li id=pt-login><a
href="/mw/index.php?title=Special:UserLogin&returnto=Action%2Frender%2FUI%2FAPI%2F1.8%2FDatepicker"
title="You are encouraged to log in; however, it is not mandatory [o]"
accesskey=o>Log in</a>
- </ul>
-</div>
+ </dl>
+ </div>
+</li>
-<!-- /PERSONAL -->
- </div><!-- /#interiorNavigation -->
- <div id="jq-primaryContent">
- <div id="column-content">
- <div id="docs-content" class="mw-body">
-
-<a id="top"></a>
-<div id="mw-js-message" style="display:none;"></div>
-<!-- firstHeading -->
-<h1 id="firstHeading" class="firstHeading"><span
dir="auto">Action/render/UI/API/1.8/Datepicker</span></h1>
-<!-- /firstHeading -->
-<!-- bodyContent -->
-<div id="bodyContent">
- <!-- tagline -->
- <div id="siteSub">From jQuery Wiki</div>
- <!-- /tagline -->
- <!-- subtitle -->
- <div id="contentSub"></div>
- <!-- /subtitle -->
- <!-- jumpto -->
- <div id="jump-to-nav" class="mw-jump">
- Jump to: <a href="#mw-head">navigation</a>, <a
href="#p-search">search</a>
- </div>
- <!-- /jumpto -->
- <!-- bodycontent -->
- <div id=mw-content-text><div class="noarticletext">
-<p>There is currently no text in this page.
-You can <a href="/Special:Search/Action/render/UI/API/1.8/Datepicker"
title="Special:Search/Action/render/UI/API/1.8/Datepicker">search for this
page title</a> in other pages, or <span class="plainlinks"><a rel=nofollow
class="external text"
href="
http://docs.jquery.com/mw/index.php?title=Special:Log&page=Action/render/UI/API/1.8/Datepicker">search
the related logs</a></span>, but you do not have permission to create this
page.
+
+<li class="option" id="option-appendText">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-appendText">appendText</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">""</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The text to display after each date field, e.g. to show the
required format.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>appendText</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ appendText: "(yyyy-mm-dd)"
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>appendText</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var appendText = $( ".selector" ).datepicker( "option", "appendText" );
+//setter
+$( ".selector" ).datepicker( "option", "appendText", "(yyyy-mm-dd)"
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-autoSize">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-autoSize">autoSize</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Set to true to automatically resize the input field to accommodate
dates in the current <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-dateFormat"
title="UI/Datepicker" class=mw-redirect>dateFormat</a></code>.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>autoSize</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ autoSize: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>autoSize</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var autoSize = $( ".selector" ).datepicker( "option", "autoSize" );
+//setter
+$( ".selector" ).datepicker( "option", "autoSize", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-buttonImage">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-buttonImage">buttonImage</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">""</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The URL for the popup button image. If set, <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-buttonText"
title="UI/Datepicker" class=mw-redirect>buttonText</a></code> becomes the
<i>alt</i> value and is not directly displayed.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>buttonImage</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({
buttonImage: "/images/datepicker.gif" });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>buttonImage</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var buttonImage = $( ".selector" ).datepicker( "option", "buttonImage" );
+//setter
+$( ".selector"
).datepicker( "option", "buttonImage", "/images/datepicker.gif"
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-buttonImageOnly">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-buttonImageOnly">buttonImageOnly</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Set to true to place an image after the field to use as the trigger
without it appearing on a button.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>buttonImageOnly</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ buttonImageOnly: true
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>buttonImageOnly</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var buttonImageOnly = $( ".selector"
).datepicker( "option", "buttonImageOnly" );
+//setter
+$( ".selector" ).datepicker( "option", "buttonImageOnly", true
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-buttonText">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-buttonText">buttonText</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"..."</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The text to display on the trigger button. Use in conjunction with
<code><a href="
http://docs.jquery.com/UI/Datepicker#option-showOn"
title="UI/Datepicker" class=mw-redirect>showOn</a></code> equal to 'button'
or 'both'.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>buttonText</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ buttonText: "Choose"
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>buttonText</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var buttonText = $( ".selector" ).datepicker( "option", "buttonText" );
+//setter
+$( ".selector" ).datepicker( "option", "buttonText", "Choose"
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-calculateWeek">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-calculateWeek">calculateWeek</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Function</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">$.datepicker.iso8601Week</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>A function to calculate the week of the year for a given date. The
default implementation uses the ISO 8601 definition: weeks start on a
Monday; the first week of the year contains the first Thursday of the
year.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>calculateWeek</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ calculateWeek: myWeekCalc
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>calculateWeek</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var calculateWeek = $( ".selector" ).datepicker( "option", "calculateWeek"
);
+//setter
+$( ".selector" ).datepicker( "option", "calculateWeek", myWeekCalc
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-changeMonth">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-changeMonth">changeMonth</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Allows you to change the month by selecting from a drop-down list.
You can enable this feature by setting the attribute to true.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>changeMonth</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ changeMonth: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>changeMonth</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var changeMonth = $( ".selector" ).datepicker( "option", "changeMonth" );
+//setter
+$( ".selector" ).datepicker( "option", "changeMonth", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-changeYear">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-changeYear">changeYear</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Allows you to change the year by selecting from a drop-down list.
You can enable this feature by setting the attribute to true. Use the
<code><a href="
http://docs.jquery.com/UI/Datepicker#option-yearRange"
title="UI/Datepicker" class=mw-redirect>yearRange</a></code> option to
control which years are made available for selection.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>changeYear</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ changeYear: true });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>changeYear</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var changeYear = $( ".selector" ).datepicker( "option", "changeYear" );
+//setter
+$( ".selector" ).datepicker( "option", "changeYear", true );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-closeText">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-closeText">closeText</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"Done"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The text to display for the close link. This attribute is one of
the regionalisation attributes. Use the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-showButtonPanel"
title="UI/Datepicker" class=mw-redirect>showButtonPanel</a></code> to
display this button.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>closeText</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ closeText: "X" });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>closeText</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var closeText = $( ".selector" ).datepicker( "option", "closeText" );
+//setter
+$( ".selector" ).datepicker( "option", "closeText", "X" );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-constrainInput">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-constrainInput">constrainInput</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">true</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>When true entry in the input field is constrained to those
characters allowed by the current <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-dateFormat"
title="UI/Datepicker" class=mw-redirect>dateFormat</a></code>.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>constrainInput</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ constrainInput: false
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>constrainInput</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var constrainInput = $( ".selector"
).datepicker( "option", "constrainInput" );
+//setter
+$( ".selector" ).datepicker( "option", "constrainInput", false
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-currentText">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-currentText">currentText</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"Today"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The text to display for the current day link. This attribute is one
of the regionalisation attributes. Use the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-showButtonPanel"
title="UI/Datepicker" class=mw-redirect>showButtonPanel</a></code> to
display this button.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>currentText</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ currentText: "Now"
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>currentText</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var currentText = $( ".selector" ).datepicker( "option", "currentText" );
+//setter
+$( ".selector" ).datepicker( "option", "currentText", "Now" );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-dateFormat">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-dateFormat">dateFormat</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">String</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">"mm/dd/yy"</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The format for parsed and displayed dates. This attribute is one of
the regionalisation attributes. For a full list of the possible formats see
the <code><a href="
http://docs.jquery.com/UI/Datepicker/formatDate"
title="UI/Datepicker/formatDate">formatDate</a></code> function.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>dateFormat</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ dateFormat: "yy-mm-dd"
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>dateFormat</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var dateFormat = $( ".selector" ).datepicker( "option", "dateFormat" );
+//setter
+$( ".selector" ).datepicker( "option", "dateFormat", "yy-mm-dd"
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-dayNames">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-dayNames">dayNames</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Array</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd
class="option-default">["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"]</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The list of long day names, starting from Sunday, for use as
requested via the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-dateFormat"
title="UI/Datepicker" class=mw-redirect>dateFormat</a></code> setting. They
also appear as popup hints when hovering over the corresponding column
headings. This attribute is one of the regionalisation attributes.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>dayNames</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ dayNames:
["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"]
});</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>dayNames</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var dayNames = $( ".selector" ).datepicker( "option", "dayNames" );
+//setter
+$( ".selector" ).datepicker( "option", "dayNames",
["Dimanche", "Lundi", "Mardi", "Mercredi", "Jeudi", "Vendredi", "Samedi"]
);</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-dayNamesMin">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-dayNamesMin">dayNamesMin</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Array</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd
class="option-default">["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"]</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The list of minimised day names, starting from Sunday, for use as
column headers within the datepicker. This attribute is one of the
regionalisation attributes.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a datepicker with the <code>dayNamesMin</code> option
specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).datepicker({ dayNamesMin:
["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"] });</code></pre>
+</dd>
+
+
+<dt>
+ Get or set the <code>dayNamesMin</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var dayNamesMin = $( ".selector" ).datepicker( "option", "dayNamesMin" );
+//setter
+$( ".selector" ).datepicker( "option", "dayNamesMin",
["Di", "Lu", "Ma", "Me", "Je", "Ve", "Sa"] );</code></pre>
+</dd>
+
+ </dl>
+ </div>
+</li>
+
+
+<li class="option" id="option-dayNamesShort">
+ <div class="option-header">
+ <h3 class="option-name"><a
href="#option-dayNamesShort">dayNamesShort</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Array</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd
class="option-default">["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"]</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>The list of abbreviated day names, starting from Sunday, for use as
requested via the <code><a
href="
http://docs.jquery.com/UI/Datepicker#option-dateFormat"
title="UI/Datepicker" class=mw-redirect>dateFormat</a></code> setting. This
attribute is one of the regionalisation attributes.</p>
+ </div>
+ <div class="option-examples">
***The diff for this file has been truncated for email.***
=======================================
--- /tags/1.8.24/docs/dialog.html Fri Sep 28 17:38:15 2012
+++ /tags/1.8.24/docs/dialog.html Sat Sep 29 09:23:39 2012
@@ -1,226 +1,1786 @@
-<!DOCTYPE html>
-<html lang=en dir=ltr class=client-nojs>
-<title>Action/render/UI/API/1.8/Dialog - jQuery Wiki</title>
-<meta charset=UTF-8>
-<meta name=generator content="MediaWiki 1.20alpha">
-<link rel="shortcut icon" href="
http://static.jquery.com/favicon.ico">
-<link rel=search type="application/opensearchdescription+xml"
href="/mw/opensearch_desc.php" title="jQuery Wiki (en)">
-<link rel=EditURI type="application/rsd+xml"
href="
http://docs.jquery.com/mw/api.php?action=rsd">
-<link rel=alternate type="application/atom+xml" title="jQuery Wiki Atom
feed" href="/mw/index.php?title=Special:RecentChanges&feed=atom">
-<link rel=stylesheet
href="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=mediawiki.legacy.commonPrint%2Cshared%7Cskins.jqdocs.layout&only=styles&skin=jqdocs&*">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/reset.css">
-<link rel=stylesheet
href="
http://static.jquery.com/files/rocker/css/screen.css"><meta
name=ResourceLoaderDynamicStyles content="">
-<style>a:lang(ar),a:lang(ckb),a:lang(fa),a:lang(kk-arab),a:lang(mzn),a:lang(ps),a:lang(ur){text-decoration:none}
-/* cache key:
jqdocs_live:resourceloader:filter:minify-css:7:36b8e618bf9eb011dd9ccb261d681e92
*/
-</style>
+<ul class="UIAPIPlugin-toc">
+<li><a href="#overview">Overview</a></li>
+<li><a href="#options">Options</a></li>
+<li><a href="#events">Events</a></li>
+<li><a href="#methods">Methods</a></li>
+<li><a href="#theming">Theming</a></li>
+</ul>
+<div class="UIAPIPlugin">
+ <h1>jQuery UI Dialog</h1>
+ <div id="overview">
+ <h2 class="top-header">Overview</h2>
+ <div id="overview-main">
+ <p>A dialog is a floating window that contains a title bar and a
content area. The dialog window can be moved, resized and closed with
the 'x' icon by default.</p>
+<p>If the content length exceeds the maximum height, a scrollbar will
automatically appear.</p>
+<p>A bottom button bar and semi-transparent modal overlay layer are common
options that can be added.</p>
+<p>A call to <code>$(foo).dialog()</code> will initialize a dialog
instance and will auto-open the dialog by default. If you want to reuse a
dialog, the easiest way is to disable the "auto-open" option with:
<code>$(foo).dialog({ autoOpen: false })</code> and open it with
<code>$(foo).dialog('open')</code>. To close it, use
<code>$(foo).dialog('close')</code>. A more in-depth explanation with a
full demo is available on <a rel=nofollow class="external text"
href="
http://blog.nemikor.com/2009/04/08/basic-usage-of-the-jquery-ui-dialog/">the
Nemikor blog</a>.</p>
+ </div>
+ <div id="overview-dependencies">
+ <h3>Dependencies</h3>
+ <ul>
+<li>UI Core</li>
+<li>UI Position</li>
+<li>UI Widget</li>
+<li>UI Mouse (Optional; only needed if using UI Draggable or UI
Resizable)</li>
+<li>UI Draggable (Optional)</li>
+<li>UI Resizable (Optional)</li>
+</ul>
+ </div>
+ <div id="overview-example">
+ <h3>Example</h3>
+ <div id="overview-example" class="example">
+<ul><li><a href="#demo"><span>Demo</span></a></li><li><a
href="#source"><span>View Source</span></a></li></ul>
+<p><div id="demo" class="tabs-container" rel="300">
+A simple jQuery UI Dialog.<br />
+</p>
+<pre>$("#dialog").dialog();
+</pre>
+<p></div><div id="source" class="tabs-container">
+</p>
+<pre><!DOCTYPE html>
+<html>
+<head>
+ <link
href="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="stylesheet" type="text/css"/>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
+ <script
src="
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
+
+ <script>
+ $(document).ready(function() {
+ $("#dialog").dialog();
+ });
+ </script>
+</head>
+<body style="font-size:62.5%;">
+
+<div id="dialog" title="Dialog Title">I'm in a
dialog</div>
-<script
src="
http://docs.jquery.com/mw/load.php?debug=false&lang=en&modules=startup&only=scripts&skin=jqdocs&*"></script>
-<script>if(
window.mw){
-mw.config.set({"wgCanonicalNamespace":"","wgCanonicalSpecialPageName":false,"wgNamespaceNumber":0,"wgPageName":"Action/render/UI/API/1.8/Dialog","wgTitle":"Action/render/UI/API/1.8/Dialog","wgCurRevisionId":0,"wgArticleId":0,"wgIsArticle":true,"wgAction":"view","wgUserName":null,"wgUserGroups":["*"],"wgCategories":[],"wgBreakFrames":false,"wgPageContentLanguage":"en","wgSeparatorTransformTable":["",""],"wgDigitTransformTable":["",""],"wgDefaultDateFormat":"dmy","wgMonthNames":["","January","February","March","April","May","June","July","August","September","October","November","December"],"wgMonthNamesShort":["","Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],"wgRelevantPageName":"Action/render/UI/API/1.8/Dialog","wgRestrictionCreate":[]});
-}</script><script>if(
window.mw){
-mw.loader.implement("user.options",function(){mw.user.options.set({"ccmeonemails":1,"cols":80,"date":"default","diffonly":0,"disablemail":0,"disablesuggest":0,"editfont":"default","editondblclick":0,"editsection":1,"editsectiononrightclick":0,"enotifminoredits":0,"enotifrevealaddr":0,"enotifusertalkpages":1,"enotifwatchlistpages":0,"extendwatchlist":0,"externaldiff":0,"externaleditor":0,"fancysig":0,"forceeditsummary":0,"gender":"unknown","hideminor":0,"hidepatrolled":0,"imagesize":2,"justify":0,"math":1,"minordefault":0,"newpageshidepatrolled":0,"nocache":0,"noconvertlink":0,"norollbackdiff":0,"numberheadings":0,"previewonfirst":0,"previewontop":1,"quickbar":5,"rcdays":7,"rclimit":50,"rememberpassword":0,"rows":25,"searchlimit":25,"showhiddencats":0,"showjumplinks":1,"shownumberswatching":1,"showtoc":1,"showtoolbar":1,"skin":"jqdocs","stubthreshold":0,"thumbsize":2,"underline":2,"uselivepreview":0,"usenewrc":0,"watchcreations":0,"watchdefault":0,"watchdeletion":0,"watchlistdays":0,
-"watchlisthideanons":0,"watchlisthidebots":0,"watchlisthideliu":0,"watchlisthideminor":0,"watchlisthideown":0,"watchlisthidepatrolled":0,"watchmoves":0,"wllimit":250,"variant":"en","language":"en","searchNs0":true,"searchNs1":false,"searchNs2":false,"searchNs3":false,"searchNs4":false,"searchNs5":false,"searchNs6":false,"searchNs7":false,"searchNs8":false,"searchNs9":false,"searchNs10":false,"searchNs11":false,"searchNs12":false,"searchNs13":false,"searchNs14":false,"searchNs15":false});;},{},{});mw.loader.implement("user.tokens",function(){mw.user.tokens.set({"editToken":"+\\","watchToken":false});;},{},{});
+</body>
+</html>
+</pre>
+<p></div>
+</p><p></div>
+ </div>
+ </div>
+ <div id="options">
+ <h2 class="top-header">Options</h2>
+ <ul class="options-list">
+
+<li class="option" id="option-disabled">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-disabled">disabled</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">false</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>Disables (true) or enables (false) the dialog. Can be set when
initialising (first creating) the dialog.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a dialog with the <code>disabled</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).dialog({ disabled: true });</code></pre>
+</dd>
-/* cache key:
jqdocs_live:resourceloader:filter:minify-js:7:4be5a79b993fd2fbf68c5ead663f2e83
*/
-}</script>
-<script>if(
window.mw){
-mw.loader.load(["mediawiki.page.startup","mediawiki.legacy.wikibits","mediawiki.legacy.ajax"]);
-}</script>
-<body class="mediawiki ltr sitedir-ltr ns-0 ns-subject
page-Action_render_UI_API_1_8_Dialog skin-jqdocs action-view"
id=jq-interior>
-<div id="jq-siteContain">
- <div id="jq-header">
- <a id="jq-siteLogo" href="
http://jquery.com/" title="jQuery Home"><img
src="
http://static.jquery.com/files/rocker/images/logo_jquery_215x53.gif"
width="215" height="53" alt="jQuery: Write Less, Do More."></a>
+
+<dt>
+ Get or set the <code>disabled</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var disabled = $( ".selector" ).dialog( "option", "disabled" );
+//setter
+$( ".selector" ).dialog( "option", "disabled", true );</code></pre>
+</dd>
- <div id="jq-primaryNavigation">
- <ul>
- <li class="jq-jquery jq-current"><a href="
http://jquery.com/"
title="jQuery Home">jQuery</a></li>
- <li class="jq-plugins"><a href="
http://plugins.jquery.com/"
title="jQuery Plugins">Plugins</a></li>
- <li class="jq-ui"><a href="
http://jqueryui.com/" title="jQuery
UI">UI</a></li>
- <li class="jq-meetup"><a href="
http://meetups.jquery.com/"
title="jQuery Meetups">Meetups</a></li>
- <li class="jq-forum"><a href="
http://forum.jquery.com/" title="jQuery
Forum">Forum</a></li>
- <li class="jq-blog"><a href="
http://blog.jquery.com/" title="jQuery
Blog">Blog</a></li>
- <li class="jq-about"><a href="
http://jquery.org/about" title="About
jQuery">About</a></li>
- <li class="jq-donate"><a href="
http://jquery.org/donate" title="Donate
to jQuery">Donate</a></li>
- </ul>
- </div><!-- /#jq-primaryNavigation -->
+ </dl>
+ </div>
+</li>
- <div id="jq-secondaryNavigation">
- <ul>
- <li class="jq-download jq-first"><a
href="
http://docs.jquery.com/Downloading_jQuery">Download</a></li>
- <li class="jq-documentation jq-current"><a
href="
http://docs.jquery.com/">Documentation</a></li>
- <li class="jq-tutorials"><a
href="
http://docs.jquery.com/Tutorials">Tutorials</a></li>
- <li class="jq-bugTracker"><a href="
http://dev.jquery.com/">Bug
Tracker</a></li>
- <li class="jq-discussion jq-last"><a
href="
http://docs.jquery.com/Discussion">Discussion</a></li>
- </ul>
- </div><!-- /#jq-secondaryNavigation -->
- <h1>Documentation</h1>
+<li class="option" id="option-autoOpen">
+ <div class="option-header">
+ <h3 class="option-name"><a href="#option-autoOpen">autoOpen</a></h3>
+ <dl>
+ <dt class="option-type-label">Type:</dt>
+ <dd class="option-type">Boolean</dd>
+
+ <dt class="option-default-label">Default:</dt>
+ <dd class="option-default">true</dd>
+
+ </dl>
+ </div>
+ <div class="option-description">
+ <p>When <i>autoOpen</i> is <i>true</i> the dialog will open
automatically when <i>dialog</i> is called. If <i>false</i> it will stay
hidden until <i>.dialog("open")</i> is called on it.</p>
+ </div>
+ <div class="option-examples">
+ <h4>Code examples</h4>
+ <dl class="option-examples-list">
+
+<dt>
+ Initialize a dialog with the <code>autoOpen</code> option specified.
+</dt>
+<dd>
+<pre><code>$( ".selector" ).dialog({ autoOpen: false });</code></pre>
+</dd>
- <form id="jq-primarySearchForm" action="/Special:Search">
- <div>
- <input type="hidden" value="1" name="ns0">
- <label for="primarySearch">Search <span
class="jq-jquery">jQuery</span></label>
- <input type="text" value="" accesskey="f" title="Search jQuery"
name="search" id="jq-primarySearch">
- <button type="submit" id="jq-searchGoButton"><span>Go</span></button>
- </div>
- </form>
- </div><!-- /#jq-header -->
+
+<dt>
+ Get or set the <code>autoOpen</code> option, after init.
+</dt>
+<dd>
+<pre><code>//getter
+var autoOpen = $( ".selector" ).dialog( "option", "autoOpen" );
+//setter
+$( ".selector" ).dialog( "option", "autoOpen", false );</code></pre>
+</dd>
- <div id="jq-content" class="jq-clearfix">
- <div id="jq-interiorNavigation">
- <div id="mw-panel" class="noprint">
- <h5>Getting Started</h5><ul>
- <li id=n-Main-Page><a href="/Main_Page">Main Page</a>
- <li id=n-Downloading-jQuery><a href="/Downloading_jQuery">Downloading
jQuery</a>
- <li id=n-How-jQuery-Works><a href="/How_jQuery_Works">How jQuery Works</a>
- <li id=n-FAQ><a href="/Frequently_Asked_Questions">FAQ</a>
- <li id=n-Tutorials><a href="/Tutorials">Tutorials</a>
- <li id=n-Using-jQuery-with-Other-Libraries><a
href="/Using_jQuery_with_Other_Libraries">Using jQuery