libs/js/jquery-mobile-1.1.0/docs/forms/selects/methods.html

   1 <!DOCTYPE html>
   2 <html>
   3         <head>
   4         <meta charset="utf-8">
   5         <meta name="viewport" content="width=device-width, initial-scale=1">
   6         <title>jQuery Mobile Docs - Select methods</title>
   7         <link rel="stylesheet"  href="../../../css/themes/default/jquery.mobile.css" />
   8         <link rel="stylesheet" href="../../_assets/css/jqm-docs.css"/>
   9         <script src="../../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
  10         <script src="../../../js/jquery.js"></script>
  11         <script src="../../../docs/_assets/js/jqm-docs.js"></script>
  12         <script src="../../../js/"></script>
  13
  14 </head>
  15 <body>
  16
  17         <div data-role="page" class="type-interior">
  18
  19                 <div data-role="header" data-theme="f">
  20                 <h1>Select Menus</h1>
  21                 <a href="../../../" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
  22                 <a href="../../nav.html" data-icon="search" data-iconpos="notext" data-rel="dialog" data-transition="fade">Search</a>
  23         </div><!-- /header -->
  24
  25         <div data-role="content">
  26                 <div class="content-primary">
  27
  28                 <form action="#" method="get">
  29
  30                         <h2>Select menus</h2>
  31
  32                         <ul data-role="controlgroup" data-type="horizontal" class="localnav">
  33                                 <li><a href="index.html" data-role="button" data-transition="fade">Basics</a></li>
  34                                 <li><a href="options.html" data-role="button" data-transition="fade">Options</a></li>
  35                                 <li><a href="methods.html" data-role="button" data-transition="fade" class="ui-btn-active">Methods</a></li>
  36                                 <li><a href="events.html" data-role="button" data-transition="fade">Events</a></li>
  37                         </ul>
  38
  39                         <p>The select menu plugin has the following methods:</p>
  40
  41                 <dl>
  42
  43                         <dt><code>close</code> close an open select menu</dt>
  44                         <dd>
  45                                 <pre><code>
  46 $('select').selectmenu('close');
  47                                 </code></pre>
  48                         </dd>
  49
  50                         <dt><code>enable</code> enable a disabled select</dt>
  51                         <dd>
  52                                 <pre><code>
  53 $('select').selectmenu('enable');
  54                                 </code></pre>
  55                         </dd>
  56
  57                         <dt><code>disable</code> disable a select.</dt>
  58                         <dd>
  59                                 <pre><code>
  60 $('select').selectmenu('disable');
  61                                 </code></pre>
  62                         </dd>
  63
  64                         <dt><code>open</code> open a closed select menu (<a href="custom.html">custom menus</a> only)</dt>
  65                         <dd>
  66                                 <pre><code>
  67 $('select').selectmenu('open');
  68                                 </code></pre>
  69                         </dd>
  70
  71                         <dt><code>refresh</code> update the custom select</dt>
  72                         <dd>
  73                          This is used to update the custom select 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.
  74                                 <pre><code>
  75 //refresh value
  76 $('select').selectmenu('refresh');
  77
  78 //refresh and force rebuild
  79 $('select').selectmenu('refresh', true);
  80                                 </code></pre>
  81                         </dd>
  82
  83                 </dl>
  84
  85         </form>
  86         </div><!--/content-primary -->
  87
  88         <div class="content-secondary">
  89
  90                 <div data-role="collapsible" data-collapsed="true" data-theme="b" data-content-theme="d">
  91
  92                                 <h3>More in this section</h3>
  93
  94                                 <ul data-role="listview" data-theme="c" data-dividertheme="d">
  95
  96                                         <li data-role="list-divider">Form elements</li>
  97                                         <li><a href="../docs-forms.html">Form basics</a></li>
  98                                         <li><a href="../forms-all.html">Form element gallery</a></li>
  99                                         <li><a href="../forms-all-mini.html">Mini form element gallery</a></li>
 100                                         <li><a href="../textinputs/index.html">Text inputs</a></li>
 101                                         <li><a href="../search/">Search input</a></li>
 102                                         <li><a href="../slider/">Slider</a></li>
 103                                         <li><a href="../switch/">Flip toggle switch</a></li>
 104                                         <li><a href="../radiobuttons/">Radio buttons</a></li>
 105                                         <li><a href="../checkboxes/">Checkboxes</a></li>
 106                                         <li data-theme="a"><a href="index.html">Select menus</a></li>
 107                                         <li><a href="../forms-themes.html">Theming forms</a></li>
 108                                         <li><a href="../forms-all-native.html">Native form elements</a></li>
 109                                         <li><a href="../forms-sample.html">Submitting forms</a></li>
 110
 111
 112                                 </ul>
 113                 </div>
 114         </div>
 115
 116 </div><!-- /content -->
 117
 118 <div data-role="footer" class="footer-docs" data-theme="c">
 119                 <p>&copy; 2011-12 The jQuery Foundation</p>
 120 </div>
 121
 122 </div><!-- /page -->
 123
 124 </body>
 125 </html>
 126