Permalink
Browse files

[] (0) WF2: Categorise form elements; redefine form.elements; define …

…fieldset.elements; add more steps to form submission (still a work in progress)

git-svn-id: http://svn.whatwg.org/webapps@2161 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information...
1 parent d1e734d commit 24c6e9a46076251d2e60db64bcb07f09895334a2 @Hixie Hixie committed Sep 10, 2008
Showing with 182 additions and 31 deletions.
  1. +104 −20 index
  2. +78 −11 source
View
@@ -28,7 +28,7 @@
<h1 id=html-5>HTML 5</h1>
- <h2 class="no-num no-toc" id=draft>Draft Recommendation &mdash; 8
+ <h2 class="no-num no-toc" id=draft>Draft Recommendation &mdash; 10
September 2008</h2>
<p>You can take part in this work. <a
@@ -1063,7 +1063,7 @@
models</a>
<ul class=toc>
<li><a href="#constraint"><span class=secno>4.9.13.1.
- </span>Constraint checking</a>
+ </span>Constraint validation</a>
<li><a href="#form-submission"><span class=secno>4.9.13.2.
</span>Form submission</a>
@@ -26502,6 +26502,34 @@ function AddCloud(data, x, y) { ... }</pre>
<h3 id=forms><span class=secno>4.9 </span>Forms</h3>
+ <p>Forms allow unscripted client-server interaction: given a form, a user
+ can provide data, submit it to the server, and have the server act on it
+ accordingly (e.g. returning the results of a search or calculation). The
+ elements used in forms can also be used for user interaction with no
+ associated submission mechanism, in conjunction with scripts.
+
+ <p>Mostly for historical reasons, elements in this section fall into
+ several overlapping (but subtly different) categories in addition to the
+ usual ones like <a href="#flow-content0">flow content</a>, <a
+ href="#phrasing0">phrasing content</a>, and <a
+ href="#interactive1">interactive content</a>.
+
+ <p>A number of the elements are <dfn id=form-associated
+ title="form-associated element">form-associated elements</dfn>, which
+ means they can have a <a href="#form-owner">form owner</a> and, to expose
+ this, have a <code title=attr-fae-form><a href="#form0">form</a></code>
+ content attribute with a matching <code title=dom-fae-form><a
+ href="#form1">form</a></code> DOM attribute.
+
+ <p>The controls that end up being submitted back to the server are in the
+ <dfn id=field title=category-field>field</dfn> category.
+
+ <p>The controls that are exposed to the <code title=dom-form-elements><a
+ href="#elements3"><var title="">form</var>.elements</a></code> and <code
+ title=dom-fieldset-elements><a href="#elements4"><var
+ title="">fieldset</var>.elements</a></code> APIs are in the <dfn id=listed
+ title=category-listed-form-element>listed form element</dfn> category.
+
<h4 id=the-form><span class=secno>4.9.1 </span>The <dfn
id=form><code>form</code></dfn> element</h4>
@@ -26565,18 +26593,14 @@ function AddCloud(data, x, y) { ... }</pre>
title=dom-form-elements><code>elements</code></dfn> DOM attribute must
return an <code><a
href="#htmlformcontrolscollection0">HTMLFormControlsCollection</a></code>
- rooted at the <code>Document</code> node, whose filter matches <code><a
- href="#input0">input</a></code>, <code><a
- href="#output">output</a></code>, <code><a
- href="#select">select</a></code>, <code><a
- href="#textarea">textarea</a></code>, <code><a
- href="#button">button</a></code>, and <code><a
- href="#fieldset">fieldset</a></code> elements whose <a
- href="#form-owner">form owner</a> is the <code><a
+ rooted at the <code>Document</code> node, whose filter matches <a
+ href="#listed" title=category-listed-form-element>listed form elements</a>
+ whose <a href="#form-owner">form owner</a> is the <code><a
href="#form">form</a></code> element, with the exception of <code><a
href="#input0">input</a></code> elements whose <code
title=attr-input-type>type</code> attribute is in the <span>Image
- Button</span> state.
+ Button</span> state, which must, for historical reasons, be excluded from
+ this particular collection.
<p>The <dfn id=length6 title=dom-form-length><code>length</code></dfn> DOM
attribute must return the number of nodes <a href="#represents"
@@ -26611,6 +26635,9 @@ function AddCloud(data, x, y) { ... }</pre>
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#flow-content0">flow content</a> is expected.
@@ -26635,7 +26662,7 @@ function AddCloud(data, x, y) { ... }</pre>
readonly attribute DOMString <span title=dom-select-type>type</span>;
- readonly attribute <a href="#htmlformcontrolscollection0">HTMLFormControlsCollection</a> <span title=dom-fieldset-elements>elements</span>;
+ readonly attribute <a href="#htmlformcontrolscollection0">HTMLFormControlsCollection</a> <a href="#elements4" title=dom-fieldset-elements>elements</a>;
readonly attribute boolean <span title=dom-fieldset-willValidate>willValidate</span>;
readonly attribute <span>ValidityState</span> <span title=dom-fieldset-validity>validity</span>;
@@ -26647,6 +26674,15 @@ function AddCloud(data, x, y) { ... }</pre>
<p class=big-issue>...
+ <p>The <dfn id=elements4
+ title=dom-fieldset-elements><code>elements</code></dfn> DOM attribute must
+ return an <code><a
+ href="#htmlformcontrolscollection0">HTMLFormControlsCollection</a></code>
+ rooted at the <code>Document</code> node, whose filter matches <a
+ href="#listed" title=category-listed-form-element>listed form elements</a>
+ that are descendants of the <code><a href="#fieldset">fieldset</a></code>
+ element.
+
<h4 id=the-input><span class=secno>4.9.3 </span>The <dfn
id=input0><code>input</code></dfn> element</h4>
@@ -26659,6 +26695,11 @@ function AddCloud(data, x, y) { ... }</pre>
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#field" title=category-field>Field</a>.
+
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#phrasing0">phrasing content</a> is expected.
@@ -26786,6 +26827,11 @@ function AddCloud(data, x, y) { ... }</pre>
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#field" title=category-field>Field</a>.
+
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#phrasing0">phrasing content</a> is expected.
@@ -26895,6 +26941,11 @@ function AddCloud(data, x, y) { ... }</pre>
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#field" title=category-field>Field</a>.
+
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#phrasing0">phrasing content</a> is expected.
@@ -27098,6 +27149,11 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#field" title=category-field>Field</a>.
+
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#phrasing0">phrasing content</a> is expected.
@@ -27183,6 +27239,9 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
<dd><a href="#form-associated">Form-associated element</a>.
+ <dd><a href="#listed" title=category-listed-form-element>Listed form
+ element</a>.
+
<dt>Contexts in which this element may be used:
<dd>Where <a href="#phrasing0">phrasing content</a> is expected.
@@ -27226,9 +27285,12 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
and forms</h4>
<!-- XXX consider xreffing the 'ID' term in this section -->
- <p>A <dfn id=form-associated>form-associated element</dfn> is one that can
- have a relationship with a <code><a href="#form">form</a></code> element,
- which is called the element's <dfn id=form-owner>form owner</dfn>.
+ <p>A <a href="#form-associated">form-associated element</a> can have a
+ relationship with a <code><a href="#form">form</a></code> element, which
+ is called the element's <dfn id=form-owner>form owner</dfn>. If a <a
+ href="#form-associated">form-associated element</a> is not associated with
+ a <code><a href="#form">form</a></code> element, its <a
+ href="#form-owner">form owner</a> is said to be null.
<p>A <a href="#form-associated">form-associated element</a> is, by default,
associated with its nearest ancestor <code><a href="#form">form</a></code>
@@ -27322,7 +27384,7 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
<h4 id=processing1><span class=secno>4.9.13 </span>Processing models</h4>
- <h5 id=constraint><span class=secno>4.9.13.1. </span>Constraint checking</h5>
+ <h5 id=constraint><span class=secno>4.9.13.1. </span>Constraint validation</h5>
<p class=big-issue>...
@@ -27342,6 +27404,28 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
abort these steps without doing anything.
<li>
+ <p>If the <var title="">submitter</var> is anything but a <code><a
+ href="#form">form</a></code> element, then <span>validate the
+ constraints</span> of <var title="">form</var> and examine the result:
+ if the result is negative (the constraint validation concluded that
+ there were invalid fields and informed the user of this) then abort
+ these steps.
+
+ <li>
+ <p>If the <var title="">submitter</var> is anything but a <code><a
+ href="#form">form</a></code> element, then <a href="#firing2">fire a
+ simple event</a> that bubbles<!--XXX-->, named <code
+ title=event-submit>submit</code>, at <var title="">form</var>. If the
+ event's default action is prevented (i.e. if the event is canceled) then
+ abort these steps. Otherwise, continue (effectively the default action
+ is to perform the submission).
+
+ <li>
+ <p>Let <var title="">controls</var> be a list of all the <a href="#field"
+ title=category-field>fields</a> whose <a href="#form-owner">form
+ owner</a> is <var title="">form</var>.
+
+ <li>
<p class=big-issue>...
</ol>
@@ -46110,7 +46194,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
and <a href="#space" title="space character">space characters</a>.
<li>The root element, in the form of an <code><a
- href="#html">html</a></code> <a href="#elements4"
+ href="#html">html</a></code> <a href="#elements5"
title=syntax-elements>element</a>.
<li>Any number of <a href="#comments0" title=syntax-comments>comments</a>
@@ -46262,7 +46346,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
<h4 id=elements1><span class=secno>8.1.2 </span>Elements</h4>
- <p>There are five different kinds of <dfn id=elements4
+ <p>There are five different kinds of <dfn id=elements5
title=syntax-elements>elements</dfn>: void elements, CDATA elements,
RCDATA elements, foreign elements, and normal elements.
@@ -46350,7 +46434,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
is <em>not</em> marked as self-closing can have <a href="#text2"
title=syntax-text>text</a>, <a href="#character5"
title=syntax-charref>character references</a>, <a href="#cdata1"
- title=syntax-cdata>CDATA sections</a>, other <a href="#elements4"
+ title=syntax-cdata>CDATA sections</a>, other <a href="#elements5"
title=syntax-elements>elements</a>, and <a href="#comments0"
title=syntax-comments>comments</a>, but the text must not contain the
character U+003C LESS-THAN SIGN (<code>&lt;</code>) or an <a
@@ -46359,7 +46443,7 @@ interface <dfn id=messagechannel>MessageChannel</dfn> {
<p>Normal elements can have <a href="#text2" title=syntax-text>text</a>, <a
href="#character5" title=syntax-charref>character references</a>, other <a
- href="#elements4" title=syntax-elements>elements</a>, and <a
+ href="#elements5" title=syntax-elements>elements</a>, and <a
href="#comments0" title=syntax-comments>comments</a>, but the text must
not contain the character U+003C LESS-THAN SIGN (<code>&lt;</code>) or an
<a href="#ambiguous" title=syntax-ambiguous-ampersand>ambiguous
Oops, something went wrong. Retry.

0 comments on commit 24c6e9a

Please sign in to comment.