[html5] r7091 - [e] (0) example for type=number Affected topics: HTML

[whatwg at whatwg.org]

Author: ianh
Date: 2012-05-07 15:13:36 -0700 (Mon, 07 May 2012)
New Revision: 7091

Modified:
   complete.html
   index
   source
Log:
[e] (0) example for type=number
Affected topics: HTML

Modified: complete.html
===================================================================
--- complete.html	2012-05-07 22:05:30 UTC (rev 7090)
+++ complete.html	2012-05-07 22:13:36 UTC (rev 7091)
@@ -47874,7 +47874,30 @@
 
   </div>
 
+  <div class=example>
 
+   <p>Here is an example of using a numeric input control:</p>
+
+   <pre><label>How much do you want to charge? $<input type=number min=0 step=0.01 name=price></label></pre>
+
+  </div>
+
+  <p class=note>The <code title="">type=number</code> state is not
+  appropriate for input that happens to only consist of numbers but
+  isn't strictly speaking a number. For example, it would be
+  inappropriate for credit card numbers or US postal codes. A simple
+  way of determining whether to use <code title="">type=number</code>
+  is to consider whether it would make sense for the input control to
+  have a spinbox interface (e.g. with "up" and "down" arrows). Getting
+  a credit card number wrong by 1 in the last digit isn't a minor
+  mistake, it's as wrong as getting every digit incorrect. So it would
+  not make sense for the user to select a credit card number using
+  "up" and "down" buttons. When a spinbox interface is not
+  appropriate, <code title="">type=text</code> is probably the right
+  choice (possibly with a <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute).</p>
+
+
+
   <h6 id="range-state-(type=range)"><span class=secno>4.10.7.1.14 </span><dfn title=attr-input-type-range>Range</dfn> state (<code title="">type=range</code>)</h6>
 
   <div class=impl>

Modified: index
===================================================================
--- index	2012-05-07 22:05:30 UTC (rev 7090)
+++ index	2012-05-07 22:13:36 UTC (rev 7091)
@@ -47874,7 +47874,30 @@
 
   </div>
 
+  <div class=example>
 
+   <p>Here is an example of using a numeric input control:</p>
+
+   <pre><label>How much do you want to charge? $<input type=number min=0 step=0.01 name=price></label></pre>
+
+  </div>
+
+  <p class=note>The <code title="">type=number</code> state is not
+  appropriate for input that happens to only consist of numbers but
+  isn't strictly speaking a number. For example, it would be
+  inappropriate for credit card numbers or US postal codes. A simple
+  way of determining whether to use <code title="">type=number</code>
+  is to consider whether it would make sense for the input control to
+  have a spinbox interface (e.g. with "up" and "down" arrows). Getting
+  a credit card number wrong by 1 in the last digit isn't a minor
+  mistake, it's as wrong as getting every digit incorrect. So it would
+  not make sense for the user to select a credit card number using
+  "up" and "down" buttons. When a spinbox interface is not
+  appropriate, <code title="">type=text</code> is probably the right
+  choice (possibly with a <code title=attr-input-pattern><a href=#attr-input-pattern>pattern</a></code> attribute).</p>
+
+
+
   <h6 id="range-state-(type=range)"><span class=secno>4.10.7.1.14 </span><dfn title=attr-input-type-range>Range</dfn> state (<code title="">type=range</code>)</h6>
 
   <div class=impl>

Modified: source
===================================================================
--- source	2012-05-07 22:05:30 UTC (rev 7090)
+++ source	2012-05-07 22:13:36 UTC (rev 7091)
@@ -55867,7 +55867,31 @@
 
   </div>
 
+  <div class="example">
 
+   <p>Here is an example of using a numeric input control:</p>
+
+   <pre><label>How much do you want to charge? $<input type=number min=0 step=0.01 name=price></label></pre>
+
+  </div>
+
+  <p class="note">The <code title="">type=number</code> state is not
+  appropriate for input that happens to only consist of numbers but
+  isn't strictly speaking a number. For example, it would be
+  inappropriate for credit card numbers or US postal codes. A simple
+  way of determining whether to use <code title="">type=number</code>
+  is to consider whether it would make sense for the input control to
+  have a spinbox interface (e.g. with "up" and "down" arrows). Getting
+  a credit card number wrong by 1 in the last digit isn't a minor
+  mistake, it's as wrong as getting every digit incorrect. So it would
+  not make sense for the user to select a credit card number using
+  "up" and "down" buttons. When a spinbox interface is not
+  appropriate, <code title="">type=text</code> is probably the right
+  choice (possibly with a <code
+  title="attr-input-pattern">pattern</code> attribute).</p>
+
+
+
   <h6><dfn title="attr-input-type-range">Range</dfn> state (<code title="">type=range</code>)</h6>
 
   <div class="impl">