- From: Ian Hickson via cvs-syncmail <cvsmail@w3.org>
- Date: Wed, 11 Aug 2010 22:03:26 +0000
- To: public-html-commits@w3.org
Update of /sources/public/html5/spec
In directory hutz:/tmp/cvs-serv14611
Modified Files:
Overview.html
Log Message:
<select required> (whatwg r5283)
Index: Overview.html
===================================================================
RCS file: /sources/public/html5/spec/Overview.html,v
retrieving revision 1.4208
retrieving revision 1.4209
diff -u -d -r1.4208 -r1.4209
--- Overview.html 11 Aug 2010 20:32:42 -0000 1.4208
+++ Overview.html 11 Aug 2010 22:03:22 -0000 1.4209
@@ -31842,6 +31842,7 @@
<dd><code title="attr-fae-form"><a href="#attr-fae-form">form</a></code></dd>
<dd><code title="attr-select-multiple"><a href="#attr-select-multiple">multiple</a></code></dd>
<dd><code title="attr-fe-name"><a href="#attr-fe-name">name</a></code></dd>
+ <dd><code title="attr-select-required"><a href="#attr-select-required">required</a></code></dd>
<dd><code title="attr-select-size"><a href="#attr-select-size">size</a></code></dd>
<dt>DOM interface:</dt>
<dd>
@@ -31851,6 +31852,7 @@
readonly attribute <a href="#htmlformelement">HTMLFormElement</a> <a href="#dom-fae-form" title="dom-fae-form">form</a>;
attribute boolean <a href="#dom-select-multiple" title="dom-select-multiple">multiple</a>;
attribute DOMString <a href="#dom-fe-name" title="dom-fe-name">name</a>;
+ attribute boolean <a href="#dom-select-required" title="dom-select-required">required</a>;
attribute unsigned long <a href="#dom-select-size" title="dom-select-size">size</a>;
readonly attribute DOMString <a href="#dom-select-type" title="dom-select-type">type</a>;
@@ -31881,11 +31883,6 @@
http://developers.slashdot.org/comments.pl?sid=426306&cid=22142072
<Philip`> http://www.ipiao.com.cn/ does <select size="1" name="to"><script type="text/javascript">City_Default="PEK"</script><SCRIPT language=javascript
src="/js/flightcity.js"></SCRIPT></select> which is the kind of thing that could be much simpler with <select value="PEK">
- * a way to make the <select> not have a default value at all (ack
- or to have a "placeholer" like value that doesn't count as a value being selected but shows a prompt until a value is selected
- * once we can have no default, a way to require="" a value.
- ack Weston Ruter: http://weston.ruter.net/projects/test-cases/html-select-element/
- q.v. http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2008-November/017583.html
--><p>The <code><a href="#the-select-element">select</a></code> element represents a control for
selecting amongst a set of options.<p>The <dfn id="attr-select-multiple" title="attr-select-multiple"><code>multiple</code></dfn>
attribute is a <a href="#boolean-attribute">boolean attribute</a>. If the attribute is
@@ -31894,12 +31891,7 @@
from the <a href="#concept-select-option-list" title="concept-select-option-list">list of
options</a>. If the attribute is absent, then the
<code><a href="#the-select-element">select</a></code> element <a href="#represents">represents</a> a control for
- selecting a single option from the <a href="#concept-select-option-list" title="concept-select-option-list">list of options</a>.<p>The <dfn id="concept-select-option-list" title="concept-select-option-list">list of options</dfn>
- for a <code><a href="#the-select-element">select</a></code> element consists of all the
- <code><a href="#the-option-element">option</a></code> element children of the <code><a href="#the-select-element">select</a></code>
- element, and all the <code><a href="#the-option-element">option</a></code> element children of all the
- <code><a href="#the-optgroup-element">optgroup</a></code> element children of the <code><a href="#the-select-element">select</a></code>
- element, in <a href="#tree-order">tree order</a>.<p>The <dfn id="attr-select-size" title="attr-select-size"><code>size</code></dfn>
+ selecting a single option from the <a href="#concept-select-option-list" title="concept-select-option-list">list of options</a>.<p>The <dfn id="attr-select-size" title="attr-select-size"><code>size</code></dfn>
attribute gives the number of options to show to the user. The <code title="attr-input-size"><a href="#attr-input-size">size</a></code> attribute, if specified, must
have a value that is a <a href="#valid-non-negative-integer">valid non-negative integer</a>
greater than zero. If the <code title="attr-select-multiple"><a href="#attr-select-multiple">multiple</a></code> attribute is present,
@@ -31917,6 +31909,39 @@
element's <a href="#concept-select-size" title="concept-select-size">display size</a> is
the default value of the attribute.</p>
+ </div><p>The <dfn id="concept-select-option-list" title="concept-select-option-list">list of options</dfn>
+ for a <code><a href="#the-select-element">select</a></code> element consists of all the
+ <code><a href="#the-option-element">option</a></code> element children of the <code><a href="#the-select-element">select</a></code>
+ element, and all the <code><a href="#the-option-element">option</a></code> element children of all the
+ <code><a href="#the-optgroup-element">optgroup</a></code> element children of the <code><a href="#the-select-element">select</a></code>
+ element, in <a href="#tree-order">tree order</a>.<p>The <dfn id="attr-select-required" title="attr-select-required"><code>required</code></dfn>
+ attribute is a <a href="#boolean-attribute">boolean attribute</a>. When specified, the
+ user will be required to select a value before submitting the
+ form.<p>If a <code><a href="#the-select-element">select</a></code> element has a <code title="attr-select-required"><a href="#attr-select-required">required</a></code> attribute specified,
+ does not have a <code title="attr-select-multiple"><a href="#attr-select-multiple">multiple</a></code>
+ attribute specified, and has a <a href="#concept-select-size" title="concept-select-size">display size</a> of 1; and if the
+ <a href="#concept-option-value" title="concept-option-value">value</a> of the first
+ <code><a href="#the-option-element">option</a></code> element in the <code><a href="#the-select-element">select</a></code> element's
+ <a href="#concept-select-option-list" title="concept-select-option-list">list of options</a> (if
+ any) is the empty string, and that <code><a href="#the-option-element">option</a></code> is not <a href="#concept-option-disabled" title="concept-option-disabled">disabled</a>, and, finally, that
+ <code><a href="#the-option-element">option</a></code> element's parent node is the <code><a href="#the-select-element">select</a></code>
+ element (and not an <code><a href="#the-optgroup-element">optgroup</a></code> element), then that
+ <code><a href="#the-option-element">option</a></code> is the <code><a href="#the-select-element">select</a></code> element's
+ <dfn id="placeholder-label-option">placeholder label option</dfn>.<div class="impl">
+
+ <p><strong>Constraint validation</strong>: If the element has its
+ <code title="attr-select-required"><a href="#attr-select-required">required</a></code> attribute
+ specified, and either none of the <code><a href="#the-option-element">option</a></code> elements in
+ the <code><a href="#the-select-element">select</a></code> element's <a href="#concept-select-option-list" title="concept-select-option-list">list of options</a> have their
+ <a href="#concept-option-selectedness" title="concept-option-selectedness">selectedness</a> set to
+ true, or the only <code><a href="#the-option-element">option</a></code> element in the
+ <code>selected</code> element's <a href="#concept-select-option-list" title="concept-select-option-list">list of options</a> with its
+ <a href="#concept-option-selectedness" title="concept-option-selectedness">selectedness</a> set to
+ true is the <a href="#placeholder-label-option">placeholder label option</a>, then the element
+ is <a href="#suffering-from-being-missing">suffering from being missing</a>.</p>
+
+ </div><div class="impl">
+
<p>If the <code title="attr-select-multiple"><a href="#attr-select-multiple">multiple</a></code>
attribute is absent, and the element is not <a href="#concept-fe-disabled" title="concept-fe-disabled">disabled</a>, then the user agent
should allow the user to pick an <code><a href="#the-option-element">option</a></code> element in its
@@ -32167,11 +32192,13 @@
value, if any, must have its <a href="#concept-option-selectedness" title="concept-option-selectedness">selectedness</a> set to
true.</p>
- <p>The <dfn id="dom-select-multiple" title="dom-select-multiple"><code>multiple</code></dfn>
- and <dfn id="dom-select-size" title="dom-select-size"><code>size</code></dfn> IDL
- attributes must <a href="#reflect">reflect</a> the respective content
- attributes of the same name. The <code title="dom-select-size"><a href="#dom-select-size">size</a></code> IDL attribute <a href="#limited-to-only-non-negative-numbers-greater-than-zero">limited to
- only non-negative numbers greater than zero</a>.</p>
+ <p>The <dfn id="dom-select-multiple" title="dom-select-multiple"><code>multiple</code></dfn>,
+ <dfn id="dom-select-required" title="dom-select-required"><code>required</code></dfn>, and
+ <dfn id="dom-select-size" title="dom-select-size"><code>size</code></dfn> IDL attributes
+ must <a href="#reflect">reflect</a> the respective content attributes of the
+ same name. The <code title="dom-select-size"><a href="#dom-select-size">size</a></code> IDL
+ attribute is <a href="#limited-to-only-non-negative-numbers-greater-than-zero">limited to only non-negative numbers greater than
+ zero</a>.</p>
<p>The <code title="dom-cva-willValidate"><a href="#dom-cva-willvalidate">willValidate</a></code>, <code title="dom-cva-validity"><a href="#dom-cva-validity">validity</a></code>, and <code title="dom-cva-validationMessage"><a href="#dom-cva-validationmessage">validationMessage</a></code>
attributes, and the <code title="dom-cva-checkValidatity"><a href="#dom-cva-checkvalidatity">checkValidity()</a></code> and <code title="dom-cva-setCustomValidity"><a href="#dom-cva-setcustomvalidity">setCustomValidity()</a></code>
@@ -32366,7 +32393,12 @@
</dd>
</dl><p>The <code><a href="#the-option-element">option</a></code> element <a href="#represents">represents</a> an option
in a <code><a href="#the-select-element">select</a></code> element or as part of a list of suggestions
- in a <code><a href="#the-datalist-element">datalist</a></code> element.<p>The <dfn id="attr-option-disabled" title="attr-option-disabled"><code>disabled</code></dfn>
+ in a <code><a href="#the-datalist-element">datalist</a></code> element.<p>In certain circumstances described in the definition of the
+ <code><a href="#the-select-element">select</a></code> element, an <code><a href="#the-option-element">option</a></code> element can be a
+ <code><a href="#the-select-element">select</a></code> element's <a href="#placeholder-label-option">placeholder label option</a>.
+ A <a href="#placeholder-label-option">placeholder label option</a> does not represent an actual
+ option, but instead represents a label for the <code><a href="#the-select-element">select</a></code>
+ control.<p>The <dfn id="attr-option-disabled" title="attr-option-disabled"><code>disabled</code></dfn>
attribute is a <a href="#boolean-attribute">boolean attribute</a>. An
<code><a href="#the-option-element">option</a></code> element is <dfn id="concept-option-disabled" title="concept-option-disabled">disabled</dfn> if its <code title="attr-option-disabled"><a href="#attr-option-disabled">disabled</a></code> attribute is present or
if it is a child of an <code><a href="#the-optgroup-element">optgroup</a></code> element whose <code title="attr-optgroup-disabled"><a href="#attr-optgroup-disabled">disabled</a></code> attribute is
@@ -34024,8 +34056,9 @@
<dl><dt> <dfn id="suffering-from-being-missing">Suffering from being missing</dfn> </dt>
- <dd> <p>When a control has no <a href="#concept-fe-value" title="concept-fe-value">value</a> but has a <code title="">required</code> attribute (<code><a href="#the-input-element">input</a></code> <code title="attr-input-required"><a href="#attr-input-required">required</a></code>, <code><a href="#the-textarea-element">textarea</a></code>
- <code title="attr-textarea-required"><a href="#attr-textarea-required">required</a></code>). </dd>
+ <dd> <p>When a control has no <a href="#concept-fe-value" title="concept-fe-value">value</a> but has a <code title="">required</code> attribute (<code><a href="#the-input-element">input</a></code> <code title="attr-input-required"><a href="#attr-input-required">required</a></code>, <code><a href="#the-select-element">select</a></code>
+ <code title="attr-select-required"><a href="#attr-select-required">required</a></code>,
+ <code><a href="#the-textarea-element">textarea</a></code> <code title="attr-textarea-required"><a href="#attr-textarea-required">required</a></code>). </dd>
<dt> <dfn id="suffering-from-a-type-mismatch">Suffering from a type mismatch</dfn> </dt>
@@ -40671,6 +40704,9 @@
<ul><li><code><a href="#the-input-element">input</a></code> elements that are <i title="concept-input-required"><a href="#concept-input-required">required</a></i></li>
+ <li><code><a href="#the-select-element">select</a></code> elements that have a <code title="attr-select-required"><a href="#attr-select-required">required</a></code>
+ attribute</li>
+
<li><code><a href="#the-textarea-element">textarea</a></code> elements that have a <code title="attr-textarea-required"><a href="#attr-textarea-required">required</a></code>
attribute</li>
@@ -40688,7 +40724,7 @@
<li><code><a href="#the-input-element">input</a></code> elements that are not <i title="concept-input-required"><a href="#concept-input-required">required</a></i></li>
- <li><code><a href="#the-select-element">select</a></code> elements</li>
+ <li><code><a href="#the-select-element">select</a></code> elements that do not have a <code title="attr-select-required"><a href="#attr-select-required">required</a></code> attribute</li>
<li><code><a href="#the-textarea-element">textarea</a></code> elements that do not have a <code title="attr-textarea-required"><a href="#attr-textarea-required">required</a></code>
attribute</li>
@@ -62545,6 +62581,16 @@
displaying the element's <code title="concept-option-label"><a href="#concept-option-label">label</a></code>, indented under its
<code><a href="#the-optgroup-element">optgroup</a></code> element if it has one.</p>
+ <p>If a <code><a href="#the-select-element">select</a></code> element contains a <a href="#placeholder-label-option">placeholder
+ label option</a>, the user agent is expected to render that
+ <code><a href="#the-option-element">option</a></code> in a manner that conveys that it is a label,
+ rather than a valid option of the control. This can include
+ preventing the <a href="#placeholder-label-option">placeholder label option</a> from being
+ explicitly selected by the user. When the <a href="#placeholder-label-option">placeholder label
+ option</a>'s <a href="#concept-option-selectedness" title="concept-option-selectedness">selectedness</a> is true, the
+ control is expected to be displayed in a fashion that indicates that
+ no valid option is currently selected.</p>
+
</div><div class="impl">
<h4 id="the-textarea-element-0"><span class="secno">10.4.15 </span>The <code><a href="#the-textarea-element">textarea</a></code> element</h4><p class="XXX annotation"><b>Status: </b><i>Last call for comments</i></p>
@@ -65636,6 +65682,7 @@
<code title="attr-fae-form"><a href="#attr-fae-form">form</a></code>;
<code title="attr-select-multiple"><a href="#attr-select-multiple">multiple</a></code>;
<code title="attr-fe-name"><a href="#attr-fe-name">name</a></code>;
+ <code title="attr-select-required"><a href="#attr-select-required">required</a></code>;
<code title="attr-select-size"><a href="#attr-select-size">size</a></code></td>
<td><code><a href="#htmlselectelement">HTMLSelectElement</a></code></td>
<tr><th><code><a href="#the-small-element">small</a></code></th>
@@ -66576,6 +66623,7 @@
<td> <a href="#set-of-space-separated-tokens">Set of space-separated tokens</a>*
<tr><th> <code title="">required</code>
<td> <code title="attr-input-required"><a href="#attr-input-required">input</a></code>;
+ <code title="attr-select-required"><a href="#attr-select-required">select</a></code>;
<code title="attr-textarea-required"><a href="#attr-textarea-required">textarea</a></code>
<td> Whether the control is required for <a href="#form-submission">form submission</a>
<td> <a href="#boolean-attribute">Boolean attribute</a>
@@ -68710,6 +68758,7 @@
Wayne Carr,
Wayne Pollock,
Wellington Fernando de Macedo,
+ Weston Ruter,
Will Levine,
William Swanson,
Wladimir Palant,
@@ -68844,9 +68893,6 @@
v2 * only submit fields that have changed, or a way to include in the
submission a list of which form controls were changed from their
default value
- v2 * have a way of marking the first option of a <select> as the default
- but have it not satisfy a new required="" attribute on <select> so
- that you can have selects that require a valid value.
v2 * type="time" value="now"
v2 * add something to type="number" to support basic currency and unit
formatting of input
Received on Wednesday, 11 August 2010 22:03:28 UTC