Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
[] (0) WF2: constraint validation API
git-svn-id: http://svn.whatwg.org/webapps@2321 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information
Hixie committed Oct 10, 2008
1 parent 51956f0 commit 99fb3c1
Show file tree
Hide file tree
Showing 2 changed files with 200 additions and 21 deletions.
110 changes: 98 additions & 12 deletions index
Expand Up @@ -22795,7 +22795,7 @@ function AddCloud(data, x, y) { ... }</pre>
readonly attribute <a href=#htmlformcontrolscollection-0>HTMLFormControlsCollection</a> <a href=#dom-fieldset-elements title=dom-fieldset-elements>elements</a>;

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -23002,7 +23002,7 @@ function AddCloud(data, x, y) { ... }</pre>
void <a href=#dom-input-stepdown title=dom-input-stepDown>stepDown</a>(in int n);

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -26274,7 +26274,7 @@ function AddCloud(data, x, y) { ... }</pre>
attribute DOMString <a href=#dom-button-value title=dom-button-value>value</a>;

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -26401,7 +26401,7 @@ function AddCloud(data, x, y) { ... }</pre>
attribute DOMString <a href=#dom-select-value title=dom-select-value>value</a>;

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -26816,7 +26816,7 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href=#htmleleme
attribute DOMString <a href=#dom-textarea-value title=dom-textarea-value>value</a>;

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -27003,7 +27003,7 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href=#htmleleme
attribute DOMString <a href=#dom-output-value title=dom-output-value>value</a>;

readonly attribute boolean <a href=#dom-cva-willvalidate title=dom-cva-willValidate>willValidate</a>;
readonly attribute <span>ValidityState</span> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute <a href=#validitystate>ValidityState</a> <a href=#dom-cva-validity title=dom-cva-validity>validity</a>;
readonly attribute DOMString <a href=#dom-cva-validationmessage title=dom-cva-validationMessage>validationMessage</a>;
boolean <a href=#dom-cva-checkvalidatity title=dom-cva-checkValidatity>checkValidity</a>();
void <a href=#dom-cva-setcustomvalidity title=dom-cva-setCustomValidity>setCustomValidity</a>(in DOMString error);
Expand Down Expand Up @@ -27380,9 +27380,19 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href=#htmleleme
constraint validation</a> if it is an <code><a href=#the-output-element>output</a></code> or
<code><a href=#the-fieldset-element>fieldset</a></code> element.)</p>

<p>An element can have a <dfn id=custom-validity-error-message>custom validity error message</dfn>
defined. Initially, an element must have its <a href=#custom-validity-error-message>custom validity
error message</a> set to the empty string. When its value is not
the empty string, the element is <a href=#suffering-from-a-custom-error>suffering from a custom
error</a>. It can be set using the <code title=dom-cva-setCustomValidity><a href=#dom-cva-setcustomvalidity>setCustomValidity()</a></code>
method. The user agent should use the <a href=#custom-validity-error-message>custom validity error
message</a> when alerting the user to the problem with the
control.</p>

<p>An element can be constrained in various ways. The following is
the list of ailments that a form control can suffer from, making the
control invalid for the purposes of constraint valiation:</p>
the list of <dfn id=validity-states>validity states</dfn> that a form control can be
in, making the control invalid for the purposes of constraint
valiation:</p>

<dl><dt> <dfn id=suffering-from-being-missing>Suffering from being missing</dfn> </dt>

Expand Down Expand Up @@ -27421,9 +27431,15 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href=#htmleleme
given by the <code title=attr-input-step><a href=#attr-input-step>step</a></code>
attribute.</dd>

<dt> <dfn id=suffering-from-a-custom-error>Suffering from a custom error</dfn> </dt>

<dd> <p>When a control's <a href=#custom-validity-error-message>custom validity error message</a>
(as set by the element's <code title=dom-cva-setCustomValidity><a href=#dom-cva-setcustomvalidity>setCustomValidity()</a></code>
method) is not the empty string.</p> </dd>

</dl><p>An element <dfn id=concept-fv-valid title=concept-fv-valid>satisfies its
constraints</dfn> if it is not suffering from any of the above
ailments.</p>
<a href=#validity-states>validity states</a>.</p>



Expand Down Expand Up @@ -27515,9 +27531,79 @@ interface <dfn id=htmloptionelement>HTMLOptionElement</dfn> : <a href=#htmleleme
conditions are <a href=#barred-from-constraint-validation title="barred from constraint
validation">barring it from constraint validation</a>).</p>

<p class=XXX> <dfn id=dom-cva-validity title=dom-cva-validity><code>validity</code></dfn> <dfn id=dom-cva-validationmessage title=dom-cva-validationMessage><code>validationMessage</code></dfn>
<dfn id=dom-cva-checkvalidatity title=dom-cva-checkValidatity><code>checkValidity()</code></dfn>
<dfn id=dom-cva-setcustomvalidity title=dom-cva-setCustomValidity><code>setCustomValidity()</code></dfn></p>
<p>The <dfn id=dom-cva-setcustomvalidity title=dom-cva-setCustomValidity><code>setCustomValidity(<var title="">message</var>)</code></dfn>, when invoked, must set the
<a href=#custom-validity-error-message>custom validity error message</a> to the value of the given
<var title="">message</var> argument.</p>

<p>The <dfn id=dom-cva-validity title=dom-cva-validity><code>validity</code></dfn>
attribute must return a <code><a href=#validitystate>ValidityState</a></code> object that
represents the <a href=#validity-states>validity states</a> of the element. This
object is live, and the same object must be returned each time the
element's <code title=dom-cva-validity><a href=#dom-cva-validity>validity</a></code> attribute
is retrieved.</p>

<pre class=idl>interface <dfn id=validitystate>ValidityState</dfn> {
readonly attribute boolean <a href=#dom-validitystate-valuemissing title=dom-ValidityState-valueMissing>valueMissing</a>;
readonly attribute boolean <a href=#dom-validitystate-typemismatch title=dom-ValidityState-typeMismatch>typeMismatch</a>;
readonly attribute boolean <a href=#dom-validitystate-patternmismatch title=dom-ValidityState-patternMismatch>patternMismatch</a>;
readonly attribute boolean <a href=#dom-validitystate-toolong title=dom-ValidityState-tooLong>tooLong</a>;
readonly attribute boolean <a href=#dom-validitystate-rangeunderflow title=dom-ValidityState-rangeUnderflow>rangeUnderflow</a>;
readonly attribute boolean <a href=#dom-validitystate-rangeoverflow title=dom-ValidityState-rangeOverflow>rangeOverflow</a>;
readonly attribute boolean <a href=#dom-validitystate-stepmismatch title=dom-ValidityState-stepMismatch>stepMismatch</a>;
readonly attribute boolean <a href=#dom-validitystate-customerror title=dom-ValidityState-customError>customError</a>;
readonly attribute boolean <a href=#dom-validitystate-valid title=dom-ValidityState-valid>valid</a>;
};</pre>

<p>A <code><a href=#validitystate>ValidityState</a></code> object has the following
attributes. On getting, they must return true if the corresponding
condition given in the following list is true, and false
otherwise.</p>

<dl><dt><dfn id=dom-validitystate-valuemissing title=dom-ValidityState-valueMissing><code>valueMissing</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-being-missing>suffering from being missing</a>.</p> </dd>

<dt><dfn id=dom-validitystate-typemismatch title=dom-ValidityState-typeMismatch><code>typeMismatch</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-a-type-mismatch>suffering from a type mismatch</a>.</p> </dd>

<dt><dfn id=dom-validitystate-patternmismatch title=dom-ValidityState-patternMismatch><code>patternMismatch</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-a-pattern-mismatch>suffering from a pattern mismatch</a>.</p> </dd>

<dt><dfn id=dom-validitystate-toolong title=dom-ValidityState-tooLong><code>tooLong</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-being-too-long>suffering from being too long</a>.</p> </dd>

<dt><dfn id=dom-validitystate-rangeunderflow title=dom-ValidityState-rangeUnderflow><code>rangeUnderflow</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-an-underflow>suffering from an underflow</a>.</p> </dd>

<dt><dfn id=dom-validitystate-rangeoverflow title=dom-ValidityState-rangeOverflow><code>rangeOverflow</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-an-overflow>suffering from an overflow</a>.</p> </dd>

<dt><dfn id=dom-validitystate-stepmismatch title=dom-ValidityState-stepMismatch><code>stepMismatch</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-a-step-mismatch>suffering from a step mismatch</a>.</p> </dd>

<dt><dfn id=dom-validitystate-customerror title=dom-ValidityState-customError><code>customError</code></dfn></dt>
<dd> <p>The control is <a href=#suffering-from-a-custom-error>suffering from a custom error</a>.</p> </dd>

<dt><dfn id=dom-validitystate-valid title=dom-ValidityState-valid><code>valid</code></dfn></dt>
<dd> <p>None of the other conditions are true.</p> </dd>

</dl><p>When the <dfn id=dom-cva-checkvalidatity title=dom-cva-checkValidatity><code>checkValidity()</code></dfn>
method is invoked, if the element is a <a href=#candidate-for-constraint-validation>candidate for
constraint validation</a> and does not <a href=#concept-fv-valid title=concept-fv-valid>satisfy its constaints</a>, the user
agent must <a href=#fire-a-simple-event>fire a simple event</a> named <code title=event-invalid>invalid</code> at the element and return
false. Otherwise, it must only return true without doing anything
else.</p>

<p>The <dfn id=dom-cva-validationmessage title=dom-cva-validationMessage><code>validationMessage</code></dfn>
attribute must return the empty string if the element is not a
<a href=#candidate-for-constraint-validation>candidate for constraint validation</a> or if it is one but
it <a href=#concept-fv-valid title=concept-fv-valid>satisfies its constaints</a>;
otherwise, it must return a suitably localised message that the user
agent would show the user if this were the only form with a validity
constraint problem. If the element is <a href=#suffering-from-a-custom-error>suffering from a custom
error</a>, then the <a href=#custom-validity-error-message>custom validity error message</a>
should be present in the return value.</p>




<h4 id=form-submission-0><span class=secno>4.10.15 </span>Form submission</h4>
Expand Down
111 changes: 102 additions & 9 deletions source
Expand Up @@ -30776,9 +30776,20 @@ interface <dfn>HTMLOptionElement</dfn> : <span>HTMLElement</span> {
constraint validation</span> if it is an <code>output</code> or
<code>fieldset</code> element.)</p>

<p>An element can have a <dfn>custom validity error message</dfn>
defined. Initially, an element must have its <span>custom validity
error message</span> set to the empty string. When its value is not
the empty string, the element is <span>suffering from a custom
error</span>. It can be set using the <code
title="dom-cva-setCustomValidity">setCustomValidity()</code>
method. The user agent should use the <span>custom validity error
message</span> when alerting the user to the problem with the
control.</p>

<p>An element can be constrained in various ways. The following is
the list of ailments that a form control can suffer from, making the
control invalid for the purposes of constraint valiation:</p>
the list of <dfn>validity states</dfn> that a form control can be
in, making the control invalid for the purposes of constraint
valiation:</p>

<dl>

Expand Down Expand Up @@ -30832,11 +30843,18 @@ interface <dfn>HTMLOptionElement</dfn> : <span>HTMLElement</span> {
given by the <code title="attr-input-step">step</code>
attribute.</p></dd>

<dt> <dfn>Suffering from a custom error</dfn> </dt>

<dd> <p>When a control's <span>custom validity error message</span>
(as set by the element's <code
title="dom-cva-setCustomValidity">setCustomValidity()</code>
method) is not the empty string.</p> </dd>

</dl>

<p>An element <dfn title="concept-fv-valid">satisfies its
constraints</dfn> if it is not suffering from any of the above
ailments.</p>
<span>validity states</span>.</p>



Expand Down Expand Up @@ -30958,13 +30976,88 @@ interface <dfn>HTMLOptionElement</dfn> : <span>HTMLElement</span> {
conditions are <span title="barred from constraint
validation">barring it from constraint validation</span>).</p>

<p class="XXX"> <dfn
title="dom-cva-validity"><code>validity</code></dfn> <dfn
title="dom-cva-validationMessage"><code>validationMessage</code></dfn>
<dfn
<p>The <dfn
title="dom-cva-setCustomValidity"><code>setCustomValidity(<var
title="">message</var>)</code></dfn>, when invoked, must set the
<span>custom validity error message</span> to the value of the given
<var title="">message</var> argument.</p>

<p>The <dfn title="dom-cva-validity"><code>validity</code></dfn>
attribute must return a <code>ValidityState</code> object that
represents the <span>validity states</span> of the element. This
object is live, and the same object must be returned each time the
element's <code title="dom-cva-validity">validity</code> attribute
is retrieved.</p>

<pre class="idl">interface <dfn>ValidityState</dfn> {
readonly attribute boolean <span title="dom-ValidityState-valueMissing">valueMissing</span>;
readonly attribute boolean <span title="dom-ValidityState-typeMismatch">typeMismatch</span>;
readonly attribute boolean <span title="dom-ValidityState-patternMismatch">patternMismatch</span>;
readonly attribute boolean <span title="dom-ValidityState-tooLong">tooLong</span>;
readonly attribute boolean <span title="dom-ValidityState-rangeUnderflow">rangeUnderflow</span>;
readonly attribute boolean <span title="dom-ValidityState-rangeOverflow">rangeOverflow</span>;
readonly attribute boolean <span title="dom-ValidityState-stepMismatch">stepMismatch</span>;
readonly attribute boolean <span title="dom-ValidityState-customError">customError</span>;
readonly attribute boolean <span title="dom-ValidityState-valid">valid</span>;
};</pre>

<p>A <code>ValidityState</code> object has the following
attributes. On getting, they must return true if the corresponding
condition given in the following list is true, and false
otherwise.</p>

<dl>
<dt><dfn title="dom-ValidityState-valueMissing"><code>valueMissing</code></dfn></dt>
<dd> <p>The control is <span>suffering from being missing</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-typeMismatch"><code>typeMismatch</code></dfn></dt>
<dd> <p>The control is <span>suffering from a type mismatch</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-patternMismatch"><code>patternMismatch</code></dfn></dt>
<dd> <p>The control is <span>suffering from a pattern mismatch</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-tooLong"><code>tooLong</code></dfn></dt>
<dd> <p>The control is <span>suffering from being too long</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-rangeUnderflow"><code>rangeUnderflow</code></dfn></dt>
<dd> <p>The control is <span>suffering from an underflow</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-rangeOverflow"><code>rangeOverflow</code></dfn></dt>
<dd> <p>The control is <span>suffering from an overflow</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-stepMismatch"><code>stepMismatch</code></dfn></dt>
<dd> <p>The control is <span>suffering from a step mismatch</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-customError"><code>customError</code></dfn></dt>
<dd> <p>The control is <span>suffering from a custom error</span>.</p> </dd>

<dt><dfn title="dom-ValidityState-valid"><code>valid</code></dfn></dt>
<dd> <p>None of the other conditions are true.</p> </dd>

</dl>

<p>When the <dfn
title="dom-cva-checkValidatity"><code>checkValidity()</code></dfn>
<dfn
title="dom-cva-setCustomValidity"><code>setCustomValidity()</code></dfn></p>
method is invoked, if the element is a <span>candidate for
constraint validation</span> and does not <span
title="concept-fv-valid">satisfy its constaints</span>, the user
agent must <span>fire a simple event</span> named <code
title="event-invalid">invalid</code> at the element and return
false. Otherwise, it must only return true without doing anything
else.</p>

<p>The <dfn
title="dom-cva-validationMessage"><code>validationMessage</code></dfn>
attribute must return the empty string if the element is not a
<span>candidate for constraint validation</span> or if it is one but
it <span title="concept-fv-valid">satisfies its constaints</span>;
otherwise, it must return a suitably localised message that the user
agent would show the user if this were the only form with a validity
constraint problem. If the element is <span>suffering from a custom
error</span>, then the <span>custom validity error message</span>
should be present in the return value.</p>




<h4>Form submission</h4>
Expand Down

0 comments on commit 99fb3c1

Please sign in to comment.