Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[] (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
Hixie committed Sep 10, 2008
1 parent d1e734d commit 24c6e9a
Show file tree
Hide file tree
Showing 2 changed files with 182 additions and 31 deletions.
124 changes: 104 additions & 20 deletions index
Expand Up @@ -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
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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>

Expand Down Expand Up @@ -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"
Expand Down Expand Up @@ -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.
Expand All @@ -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>;
Expand All @@ -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>

Expand All @@ -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.
Expand Down Expand Up @@ -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.
Expand Down Expand Up @@ -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.
Expand Down Expand Up @@ -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.
Expand Down Expand Up @@ -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.
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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>...

Expand All @@ -27341,6 +27403,28 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href="#htmlelem
href="#sandboxed3">sandboxed forms browsing context flag</a> set, then
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>
Expand Down Expand Up @@ -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>
Expand Down Expand Up @@ -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.

Expand Down Expand Up @@ -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
Expand All @@ -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
Expand Down

0 comments on commit 24c6e9a

Please sign in to comment.