[html5] r3814 - [e] (0) <form>, <fieldset> examples

[whatwg at whatwg.org]

Author: ianh
Date: 2009-09-12 01:44:05 -0700 (Sat, 12 Sep 2009)
New Revision: 3814

Modified:
   index
   source
Log:
[e] (0) <form>, <fieldset> examples

Modified: index
===================================================================
--- index	2009-09-12 04:07:09 UTC (rev 3813)
+++ index	2009-09-12 08:44:05 UTC (rev 3814)
@@ -30362,8 +30362,22 @@
 
   </div>
 
+  <div class=example>
 
+   <p>This example shows two search forms:</p>
 
+   <pre><form action="http://www.google.com/search" method="get">
+ <label>Google: <input type="search" name="q"></label> <input type="submit" value="Search...">
+</form>
+<form action="http://www.bing.com/search" method="get">
+ <label>Bing: <input type="search" name="q"></label> <input type="submit" value="Search...">
+</form></pre>
+
+  </div>
+
+
+
+
   <h4 id=the-fieldset-element><span class=secno>4.10.2 </span>The <dfn><code>fieldset</code></dfn> element</h4>
 
   <dl class=element><dt>Categories</dt>
@@ -30455,8 +30469,27 @@
 
   </div>
 
+  <div class=example>
 
+   <p>The following snippet shows a fieldset with a checkbox in the
+   legend that controls whether or not the fieldset is enabled. The
+   contents of the fieldset consist of two required text fields and an
+   optional year/month control.</p>
 
+   <pre><fieldset name="clubfields" disabled>
+ <legend> <label>
+  <input type=checkbox name=club onchange="form.clubfields.disabled = !checked">
+  Use Club Card
+ </label> </legend>
+ <p><label>Name on card: <input name=clubname required></label></p>
+ <p><label>Card number: <input name=clubnum required pattern="[-0-9]+"></label></p>
+ <p><label>Expiry date: <input name=clubexp type=month></label></p>
+</fieldset></pre>
+
+  </div>
+
+
+
   <h4 id=the-label-element><span class=secno>4.10.3 </span>The <dfn><code>label</code></dfn> element</h4>
 
   <dl class=element><dt>Categories</dt>

Modified: source
===================================================================
--- source	2009-09-12 04:07:09 UTC (rev 3813)
+++ source	2009-09-12 08:44:05 UTC (rev 3814)
@@ -33692,8 +33692,22 @@
 
   </div>
 
+  <div class="example">
 
+   <p>This example shows two search forms:</p>
 
+   <pre><form action="http://www.google.com/search" method="get">
+ <label>Google: <input type="search" name="q"></label> <input type="submit" value="Search...">
+</form>
+<form action="http://www.bing.com/search" method="get">
+ <label>Bing: <input type="search" name="q"></label> <input type="submit" value="Search...">
+</form></pre>
+
+  </div>
+
+
+
+
   <h4>The <dfn><code>fieldset</code></dfn> element</h4>
 
   <dl class="element">
@@ -33800,8 +33814,27 @@
 
   </div>
 
+  <div class="example">
 
+   <p>The following snippet shows a fieldset with a checkbox in the
+   legend that controls whether or not the fieldset is enabled. The
+   contents of the fieldset consist of two required text fields and an
+   optional year/month control.</p>
 
+   <pre><fieldset name="clubfields" disabled>
+ <legend> <label>
+  <input type=checkbox name=club onchange="form.clubfields.disabled = !checked">
+  Use Club Card
+ </label> </legend>
+ <p><label>Name on card: <input name=clubname required></label></p>
+ <p><label>Card number: <input name=clubnum required pattern="[-0-9]+"></label></p>
+ <p><label>Expiry date: <input name=clubexp type=month></label></p>
+</fieldset></pre>
+
+  </div>
+
+
+
   <h4>The <dfn><code>label</code></dfn> element</h4>
 
   <dl class="element">