[e] (0) <select> examples

git-svn-id: http://svn.whatwg.org/webapps@3822 340c8d12-0b0e-0410-8428-c7bf67bfef74
whatwg · Sep 13, 2009 · dec05a3 · dec05a3
1 parent e76a6c0
commit dec05a3
Show file tree

Hide file tree

Showing 2 changed files with 78 additions and 0 deletions.
diff --git a/index b/index
@@ -36058,6 +36058,45 @@ You cannot complete this form until the field is correct.</samp></pre>
 
   </div>
 
+  <div class=example>
+
+   <p>The following example shows how a <code><a href=#the-select-element>select</a></code> element
+   can be used to offer the user with a set of options from which the
+   user can select a single option. The default option is
+   preselected</p>
+
+   <pre>&lt;p&gt;
+ &lt;label for="unittype"&gt;Select unit type:&lt;/label&gt;
+ &lt;select id="unittype" name="unittype"&gt;
+  &lt;option value="1"&gt; Miner &lt;/option&gt;
+  &lt;option value="2"&gt; Puffer &lt;/option&gt;
+  &lt;option value="3" selected&gt; Snipey &lt;/option&gt;
+  &lt;option value="4"&gt; Max &lt;/option&gt;
+  &lt;option value="5"&gt; Firebot &lt;/option&gt;
+ &lt;/select&gt;
+&lt;/p&gt;</pre>
+
+  </div>
+
+  <div class=example>
+
+   <p>Here, the user is offered a set of options from which he can
+   select any number. By default, all five options are selected.</p>
+
+   <pre>&lt;p&gt;
+ &lt;label for="allowedunits"&gt;Select unit types to enable on this map:&lt;/label&gt;
+ &lt;select id="allowedunits" name="allowedunits" multiple&gt;
+  &lt;option value="1" selected&gt; Miner &lt;/option&gt;
+  &lt;option value="2" selected&gt; Puffer &lt;/option&gt;
+  &lt;option value="3" selected&gt; Snipey &lt;/option&gt;
+  &lt;option value="4" selected&gt; Max &lt;/option&gt;
+  &lt;option value="5" selected&gt; Firebot &lt;/option&gt;
+ &lt;/select&gt;
+&lt;/p&gt;</pre>
+
+  </div>
+
+
 
   <h4 id=the-datalist-element><span class=secno>4.10.7 </span>The <dfn><code>datalist</code></dfn> element</h4>
 

diff --git a/source b/source
@@ -40237,6 +40237,45 @@ You cannot complete this form until the field is correct.</samp></pre>
 
   </div>
 
+  <div class="example">
+
+   <p>The following example shows how a <code>select</code> element
+   can be used to offer the user with a set of options from which the
+   user can select a single option. The default option is
+   preselected</p>
+
+   <pre>&lt;p>
+ &lt;label for="unittype">Select unit type:&lt;/label>
+ &lt;select id="unittype" name="unittype">
+  &lt;option value="1"> Miner &lt;/option>
+  &lt;option value="2"> Puffer &lt;/option>
+  &lt;option value="3" selected> Snipey &lt;/option>
+  &lt;option value="4"> Max &lt;/option>
+  &lt;option value="5"> Firebot &lt;/option>
+ &lt;/select>
+&lt;/p></pre>
+
+  </div>
+
+  <div class="example">
+
+   <p>Here, the user is offered a set of options from which he can
+   select any number. By default, all five options are selected.</p>
+
+   <pre>&lt;p>
+ &lt;label for="allowedunits">Select unit types to enable on this map:&lt;/label>
+ &lt;select id="allowedunits" name="allowedunits" multiple>
+  &lt;option value="1" selected> Miner &lt;/option>
+  &lt;option value="2" selected> Puffer &lt;/option>
+  &lt;option value="3" selected> Snipey &lt;/option>
+  &lt;option value="4" selected> Max &lt;/option>
+  &lt;option value="5" selected> Firebot &lt;/option>
+ &lt;/select>
+&lt;/p></pre>
+
+  </div>
+
+
 
   <h4>The <dfn><code>datalist</code></dfn> element</h4>