W3C home > Mailing lists > Public > public-html-commits@w3.org > October 2010

html5/spec Overview.html,1.4496,1.4497

From: Ian Hickson via cvs-syncmail <cvsmail@w3.org>
Date: Thu, 14 Oct 2010 07:40:28 +0000
To: public-html-commits@w3.org
Message-Id: <E1P6IQO-000423-Td@lionel-hutz.w3.org>
Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv15345

Modified Files:
	Overview.html 
Log Message:
new example of nested disabled fieldsets (whatwg r5621)

Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.4496
retrieving revision 1.4497
diff -u -d -r1.4496 -r1.4497
--- Overview.html	13 Oct 2010 20:19:05 -0000	1.4496
+++ Overview.html	14 Oct 2010 07:40:25 -0000	1.4497
@@ -27678,6 +27678,41 @@
  &lt;p&gt;&lt;label&gt;Expiry date: &lt;input name=clubexp type=month&gt;&lt;/label&gt;&lt;/p&gt;
 &lt;/fieldset&gt;</pre>
 
+  </div><div class="example">
+
+   <p>You can also nest <code><a href="#the-fieldset-element">fieldset</a></code> elements. Here is an
+   example expanding on the previous one that does so:</p>
+
+   <pre>&lt;fieldset name="clubfields" disabled&gt;
+ &lt;legend&gt; &lt;label&gt;
+  &lt;input type=checkbox name=club onchange="form.clubfields.disabled = !checked"&gt;
+  Use Club Card
+ &lt;/label&gt; &lt;/legend&gt;
+ &lt;p&gt;&lt;label&gt;Name on card: &lt;input name=clubname required&gt;&lt;/label&gt;&lt;/p&gt;
+ &lt;fieldset name="numfields"&gt;
+  &lt;legend&gt; &lt;label&gt;
+   &lt;input type=radio checked name=clubtype onchange="form.numfields.disabled = !checked"&gt;
+   My card has numbers on it
+  &lt;/label&gt; &lt;/legend&gt;
+  &lt;p&gt;&lt;label&gt;Card number: &lt;input name=clubnum required pattern="[-0-9]+"&gt;&lt;/label&gt;&lt;/p&gt;
+ &lt;/fieldset&gt;
+ &lt;fieldset name="letfields" disabled&gt;
+  &lt;legend&gt; &lt;label&gt;
+   &lt;input type=radio name=clubtype onchange="form.letfields.disabled = !checked"&gt;
+   My card has letters on it
+  &lt;/label&gt; &lt;/legend&gt;
+  &lt;p&gt;&lt;label&gt;Card code: &lt;input name=clublet required pattern="[A-Za-z]+"&gt;&lt;/label&gt;&lt;/p&gt;
+ &lt;/fieldset&gt;
+&lt;/fieldset&gt;</pre>
+
+   <p>In this example, if the outer "Use Club Card" checkbox is not
+   checked, everything inside the outer <code><a href="#the-fieldset-element">fieldset</a></code>,
+   including the two radio buttons in the legends of the two nested
+   <code><a href="#the-fieldset-element">fieldset</a></code>s, will be disabled. However, if the checkbox
+   is checked, then the radio buttons will both be enabled and will
+   let you select which of the two inner <code><a href="#the-fieldset-element">fieldset</a></code>s is to
+   be enabled.</p>
+
   </div><h4 id="the-legend-element"><span class="secno">4.10.5 </span>The <dfn><code>legend</code></dfn> element</h4><dl class="element"><dt>Categories</dt>
    <dd>None.</dd>
    <dt>Contexts in which this element can be used:</dt>
Received on Thursday, 14 October 2010 07:40:30 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Thursday, 14 October 2010 07:40:33 GMT