Permalink
Browse files

docs updates

  • Loading branch information...
1 parent 058f0a8 commit aec0cbc946ecaa75559dd15f7f48c1edfef961b0 scottjehl committed Nov 11, 2010
Showing with 144 additions and 0 deletions.
  1. +1 −0 docs/forms/index.html
  2. +130 −0 docs/forms/plugin-eventsmethods.html
  3. +6 −0 docs/lists/docs-lists.html
  4. +7 −0 docs/toolbars/docs-headers.html
View
@@ -31,6 +31,7 @@ <h1>Form elements</h1>
<li><a href="forms-selects.html">Select menus</a></li>
<li><a href="forms-themes.html">Theming forms</a></li>
<li><a href="forms-sample.html">Submitting forms</a></li>
+ <li><a href="plugin-eventsmethods.html">Plugin methods</a></li>
<!--<li><a href="api-forms.html">API documentation</a></li>-->
</ul>
</div><!-- /ui-body wrapper -->
@@ -0,0 +1,130 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta charset="utf-8" />
+ <title>jQuery Mobile Docs - Form Plugin Methods</title>
+ <link rel="stylesheet" href="../../themes/default" />
+ <link rel="stylesheet" href="../_assets/css/jqm-docs.css"/>
+ <script type="text/javascript" src="../../js/"></script>
+</head>
+<body>
+
+<div data-role="page">
+
+ <div data-role="header">
+ <h1>Form Plugin Methods</h1>
+ </div><!-- /header -->
+
+ <div data-role="content">
+
+ <p>After jQuery Mobile auto-enhances form controls into custom controls, you can manipulate many of their properties via plugin methods. The currently available methods are listed below. Check Github for updates - we're working on complete coverage.</p>
+
+ <h2>Selectmenu</h2>
+ <dl>
+ <dt>Methods</dt>
+ <dd><code>open</code> open a closed select menu</dd>
+ <dd>
+ <pre><code>
+$('select').selectmenu('open');
+ </code></pre>
+ </dd>
+
+ <dd><code>close</code> close an open select menu</dd>
+ <dd>
+ <pre><code>
+$('select').selectmenu('close');
+ </code></pre>
+ </dd>
+
+ <dd><code>refresh</code>: Update the custom menu to reflect the native select element's value. If the number of options in the select are different than the number of items in the custom menu, it'll rebuild the custom menu. Also, if you pass a true argument you can force the rebuild to happen.</dd>
+ <dd>
+ <pre><code>
+//refresh value
+$('select').selectmenu('refresh');
+
+//refresh and force rebuild
+$('select').selectmenu('refresh', true);
+ </code></pre>
+ </dd>
+
+ <dd><code>enable</code>: enable a disabled select.</dd>
+ <dd>
+ <pre><code>
+$('select').selectmenu('enable');
+ </code></pre>
+ </dd>
+
+ <dd><code>disable</code>: disable a select.</dd>
+ <dd>
+ <pre><code>
+$('select').selectmenu('disable');
+ </code></pre>
+ </dd>
+
+ </dl>
+
+
+
+
+
+
+ <h2>Textinput</h2>
+ <dl>
+ <dt>Methods</dt>
+
+ <dd><code>enable</code>: enable a disabled textinput/textarea.</dd>
+ <dd>
+ <pre><code>
+$('input').textinput('enable');
+ </code></pre>
+ </dd>
+
+ <dd><code>disable</code>: disable a textinput/textarea.</dd>
+ <dd>
+ <pre><code>
+$('textarea').textinput('disable');
+ </code></pre>
+ </dd>
+
+ </dl>
+
+
+
+
+
+ <h2>checkboxradio</h2>
+ <dl>
+ <dt>Methods</dt>
+
+ <dd><code>enable</code>: enable a disabled checkboxradio.</dd>
+ <dd>
+ <pre><code>
+$('input').checkboxradio('enable');
+ </code></pre>
+ </dd>
+
+ <dd><code>disable</code>: disable a checkboxradio.</dd>
+ <dd>
+ <pre><code>
+$('textarea').checkboxradio('disable');
+ </code></pre>
+ </dd>
+
+ <dd><code>refresh</code>: refresh a checkboxradio's value.</dd>
+ <dd>
+ <pre><code>
+$('textarea').checkboxradio('refresh');
+ </code></pre>
+ </dd>
+ </dl>
+
+
+
+
+
+ </div><!-- /content -->
+
+</div><!-- /page -->
+
+</body>
+</html>
@@ -84,6 +84,12 @@ <h2>Inset lists</h2>
<p>If lists are embedded in a page with other types of content, an inset list packages the list into a block that sits inside the content area with a bit of margin and rounded corners (theme controlled). By adding the <code>data-inset="true"</code> attribute to the list (ul or ol), applies the inset appearance.</p>
<a href="lists-inset.html" data-role="button" data-icon="arrow-r" data-iconpos="right">Inset list example</a>
+
+ <h2>Updating lists</h2>
+ <p>If you add items to a listview, you'll need to call the <code>refresh()</code> method on it to update the styles and create any nested lists that are added. For example, <code>$('ul').listview('refresh');</code></p>
+
+ <p>We're currently working on a few improvements to the refresh method, so keep your eye on Github for updates.</p>
+
</div><!-- /content -->
</div><!-- /page -->
@@ -103,6 +103,13 @@ <h3>Controlling button position with classes</h3>
<h1>Page Title</h1>
<a href="index.html" data-icon="gear" class="ui-btn-right">Options</a>
</div>
+
+ <h2>Customizing the back button text</h2>
+
+ <p>If you'd like to configure the back button text, you can either use the <code>data-back-btn-text="previous"</code> attribute on your page element, or set it programmatically via the page plugin's options: <code>$.mobile.page.prototype.options.backBtnText = "previous";</code>. If you're doing this programmatically, set this option inside the mobileinit event handler.</p>
+
+
+
<h2>Custom header configurations</h2>
<p>If you need to to create a header that doesn't follow the default configuration, simply wrap your custom styled markup in a container <code>div</code> inside the header container and the plugin won't apply the automatic button logic so you can write custom styles for laying out the content in your header.</p>

0 comments on commit aec0cbc

Please sign in to comment.