[html5] r7365 - [e] (0) Clarify things around readonly='', add more variety to the way boolean a [...]

whatwg at whatwg.org whatwg at whatwg.org
Sun Sep 16 23:47:47 PDT 2012


Author: ianh
Date: 2012-09-16 23:47:47 -0700 (Sun, 16 Sep 2012)
New Revision: 7365

Modified:
   source
Log:
[e] (0) Clarify things around readonly='', add more variety to the way boolean attributes are used in examples.
Affected topics: HTML

Modified: source
===================================================================
--- source	2012-09-17 05:17:44 UTC (rev 7364)
+++ source	2012-09-17 06:47:47 UTC (rev 7365)
@@ -60228,6 +60228,15 @@
 
   </div>
 
+  <p class="note">The difference between <code
+  title="attr-fe-disabled">disabled</code> and <code
+  title="attr-input-readonly">readonly</code> is that read-only
+  controls are still focusable, so the user can still select the text
+  and interact with it, whereas disabled controls are entirely
+  non-interactive. (For this reason, only text controls can be made
+  read-only: it wouldn't make sense for checkboxes or buttons, for
+  instances.)</p>
+
   <div class="example">
 
    <p>In the following example, the existing product identifiers
@@ -60235,26 +60244,26 @@
    form, for consistency with the row representing a new product
    (where the identifier is not yet filled in).</p>
 
-   <pre><form action="products.cgi" method=post enctype="multipart/form-data">
+   <pre><form action="products.cgi" method="post" enctype="multipart/form-data">
  <table>
   <tr> <th> Product ID <th> Product name <th> Price <th> Action
   <tr>
-   <td> <input readonly name="1.pid" value="H412">
-   <td> <input required name="1.pname" value="Floor lamp Ulke">
-   <td> $<input required type=number min=0 step=0.01 name="1.pprice" value="49.99">
-   <td> <button formnovalidate name="action" value="delete:1">Delete</button>
+   <td> <input readonly="readonly" name="1.pid" value="H412">
+   <td> <input required="required" name="1.pname" value="Floor lamp Ulke">
+   <td> $<input required="required" type="number" min="0" step="0.01" name="1.pprice" value="49.99">
+   <td> <button formnovalidate="formnovalidate" name="action" value="delete:1">Delete</button>
   <tr>
-   <td> <input readonly name="2.pid" value="FG28">
-   <td> <input required name="2.pname" value="Table lamp Ulke">
-   <td> $<input required type=number min=0 step=0.01 name="2.pprice" value="24.99">
-   <td> <button formnovalidate name="action" value="delete:2">Delete</button>
+   <td> <input readonly="readonly" name="2.pid" value="FG28">
+   <td> <input required="required" name="2.pname" value="Table lamp Ulke">
+   <td> $<input required="required" type="number" min="0" step="0.01" name="2.pprice" value="24.99">
+   <td> <button formnovalidate="formnovalidate" name="action" value="delete:2">Delete</button>
   <tr>
-   <td> <input required name="3.pid" value="" pattern="[A-Z0-9]+">
-   <td> <input required name="3.pname" value="">
-   <td> $<input required type=number min=0 step=0.01 name="3.pprice" value="">
-   <td> <button formnovalidate name="action" value="delete:3">Delete</button>
+   <td> <input required="required" name="3.pid" value="" pattern="[A-Z0-9]+">
+   <td> <input required="required" name="3.pname" value="">
+   <td> $<input required="required" type="number" min="0" step="0.01" name="3.pprice" value="">
+   <td> <button formnovalidate="formnovalidate" name="action" value="delete:3">Delete</button>
  </table>
- <p> <button formnovalidate name="action" value="add">Add</button> </p>
+ <p> <button formnovalidate="formnovalidate" name="action" value="add">Add</button> </p>
  <p> <button name="action" value="update">Save</button> </p>
 </form></pre>
 
@@ -60565,7 +60574,7 @@
    <p>The following number control limits input to whole numbers
    greater than zero:</p>
 
-   <pre><input name=quantity required type=number min=1 value=1></pre>
+   <pre><input name=quantity required="" type="number" min="1" value="1"></pre>
 
   </div>
 
@@ -62710,6 +62719,25 @@
   is a <span>boolean attribute</span> used to control whether the text
   can be edited by the user or not.</p>
 
+  <div class="example">
+
+   <p>In this example, a text field is marked read-only because it
+   represents a read-only file:</p>
+
+   <pre>Filename: <code>/etc/bash.bashrc</code>
+<textarea name="buffer" readonly>
+# System-wide .bashrc file for interactive bash(1) shells.
+
+# To enable the settings / commands in this file for login shells as well,
+# this file has to be sourced in /etc/profile.
+
+# If not running interactively, don't do anything
+[ -z "$PS1" ] &amp;&amp; return
+
+...</textarea></pre>
+
+  </div>
+
   <div class="impl">
 
   <p><strong>Constraint validation</strong>: If the <code




More information about the Commit-Watchers mailing list