Skip to content
Permalink
Browse files

[] (0) WF2: input.value default for checkboxes; readonly for type=ran…

…ge; somes notes; update the informative table of attribute applyingness.

git-svn-id: http://svn.whatwg.org/webapps@2258 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information...
Hixie committed Oct 2, 2008
1 parent 92aee09 commit 4594fd10b3657411f596c1a2f5920001cf9f9abf
Showing with 131 additions and 105 deletions.
  1. +65 −52 index
  2. +66 −53 source
117 index
form-associated elements</span>, on getting, must return that
<code>NodeList</code> object.</p>

<!-- The label element's exact default presentation and behaviour
should match the platform's label behaviour. For example, on
platforms where clicking a checkbox label checks the checkbox,
clicking a label element should cause a click event to be
synthesised and fired at the checkbox. XXX should define activation
behaviour here; clicking on nested link? nested label? label when it
has a checkbox? etc -->


<h4 id=the-input-element><span class=secno>4.10.4 </span>The <dfn><code>input</code></dfn> element</h4>
<th> <a href=#week-state title=attr-input-type-week>Week</a>
<th> <a href=#time-state title=attr-input-type-time>Time</a>
<th> <a href=#local-date-and-time-state title=attr-input-type-datetime-local>Local Date and Time</a>

<th> <a href=#number-state title=attr-input-type-number>Number</a>
<th> <a href=#range-state title=attr-input-type-range>Range</a>
<th> <a href=#checkbox-state title=attr-input-type-checkbox>Checkbox</a>
<th> <a href=#radio-button-state title=attr-input-type-radio>Radio Button</a>

<th> <a href=#file-state title=attr-input-type-file>File</a>
<th> <a href=#hidden-state title=attr-input-type-hidden>Hidden</a>
<th> <a href=#submit-button-state title=attr-input-type-submit>Submit Button</a>
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=yes> Yes <!-- Checkbox -->
<td class=yes> Yes <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Hidden -->
<td class=no> &middot; <!-- Submit Button -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=Yes> Yes <!-- Number -->
<td class=Yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=yes> Yes <!-- Checkbox -->
<td class=yes> Yes <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Hidden -->
<td class=no> &middot; <!-- Submit Button -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Reset Button -->
<td class=no> &middot; <!-- Button -->

<tr><th> <code title=dom-input-checked><a href=#dom-input-checked>checked</a></code>
<tr><!-- complete --><th> <code title=dom-input-checked><a href=#dom-input-checked>checked</a></code>
<td class=no> &middot; <!-- Text -->
<td class=no> &middot; <!-- E-mail -->
<td class=no> &middot; <!-- URL -->
<td class=no> &middot; <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=yes> Yes <!-- Checkbox -->
<td class=yes> Yes <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Hidden -->
<td class=no> &middot; <!-- Submit Button -->
<td class=no> &middot; <!-- Image Button -->
<td class=no> &middot; <!-- Reset Button -->
<td class=no> &middot; <!-- Button -->

<tr><th> <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>
<td class=no> &middot; <!-- Text -->
<td class=no> &middot; <!-- E-mail -->
<td class=no> &middot; <!-- URL -->
<td class=no> &middot; <!-- Password -->
<tr><th> <code title=dom-input-value><a href=#dom-input-value>value</a></code>
<td class=yes> Yes <!-- Text -->
<td class=yes> Yes <!-- E-mail -->
<td class=yes> Yes <!-- URL -->
<td class=yes> Yes <!-- Password -->
<td class=yes> Yes <!-- Date and Time -->
<td class=yes> Yes <!-- Date -->
<td class=yes> Yes <!-- Month -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=no> &middot; <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=no> &middot; <!-- Reset Button -->
<td class=no> &middot; <!-- Button -->

<tr><th> <code title=dom-input-value><a href=#dom-input-value>value</a></code>
<td class=yes> Yes <!-- Text -->
<td class=yes> Yes <!-- E-mail -->
<td class=yes> Yes <!-- URL -->
<td class=yes> Yes <!-- Password -->
<tr><!-- complete --><th> <code title=dom-input-valueAsDate><a href=#dom-input-valueasdate>valueAsDate</a></code>
<td class=no> &middot; <!-- Text -->
<td class=no> &middot; <!-- E-mail -->
<td class=no> &middot; <!-- URL -->
<td class=no> &middot; <!-- Password -->
<td class=yes> Yes <!-- Date and Time -->
<td class=yes> Yes <!-- Date -->
<td class=yes> Yes <!-- Month -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
<td class=yes> Yes <!-- Week -->
<td class=yes> Yes <!-- Time -->
<td class=yes> Yes <!-- Local Date and Time -->
<td class=no> &middot; <!-- Number -->
<td class=no> &middot; <!-- Range -->
<td class=yes> Yes <!-- Number -->
<td class=yes> Yes <!-- Range -->
<td class=no> &middot; <!-- Checkbox -->
<td class=no> &middot; <!-- Radio Button -->
<td class=no> &middot; <!-- File -->
serialisation. e.g. should it be 2008-01-01T00:00 or
2008-01-01t00:00? should it be 1e2 or 100? -->

<!-- XXX for each of these, need to say when to fire oninput,
onchange, and when required='' is satisfied -->

<h6 id=text-state><span class=secno>4.10.4.1.1 </span><dfn title=attr-input-type-text>Text</dfn> state</h6>

<p>When an <code><a href=#the-input-element>input</a></code> element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#text-state title=attr-input-type-text>Text</a> state, the rules in this
<code title=attr-input-list>list</code>,
<code title=attr-input-max><a href=#attr-input-max>max</a></code>,
<code title=attr-input-min><a href=#attr-input-min>min</a></code>,
<code title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>,
<code title=attr-input-required>required</code>, and
<code title=attr-input-step><a href=#attr-input-step>step</a></code> content attributes;
<code title=dom-input-list><a href=#dom-input-list>list</a></code>,
<code class=no-backref title=attr-input-maxlength><a href=#attr-input-maxlength>maxlength</a></code>,
<code class=no-backref title=attr-fs-method><a href=#attr-fs-method>method</a></code>,
<code class=no-backref title=attr-input-pattern>pattern</code>,
<code class=no-backref title=attr-input-readonly><a href=#attr-input-readonly>readonly</a></code>,
<code class=no-backref title=attr-input-size>size</code>,
<code class=no-backref title=attr-input-src>src</code>, and
<code class=no-backref title=attr-fs-target><a href=#attr-fs-target>target</a></code>.</p>
element's <a href=#concept-input-value-dirty-flag title=concept-input-value-dirty-flag>dirty value
flag</a> to true, and then invoke the <a href=#value-sanitization-algorithm>value sanitization
algorithm</a> defined for the element's <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute's current state. If
the attribute does not apply, then it must <a href=#reflect>reflect</a> the
element's <code title=attr-input-value><a href=#attr-input-value>value</a></code> content
attribute.</p>
the attribute does not apply, then on getting, if the element has a
<code title=attr-input-value><a href=#attr-input-value>value</a></code> attribute, it must
return that attribute's value; otherwise, it must return the string
"<code title="">on</code>"; and on setting, it must set the
element's <code title=attr-input-value><a href=#attr-input-value>value</a></code> attribute to
the new value.</p>

<p>The <dfn id=dom-input-checked title=dom-input-checked><code>checked</code></dfn> DOM
attribute allows scripts to manipulate the <a href=#concept-fe-checked title=concept-fe-checked>checkedness</a> of an

0 comments on commit 4594fd1

Please sign in to comment.
You can’t perform that action at this time.