Skip to content
Permalink
Browse files

[] (0) WF2: <textarea> element summary.

git-svn-id: http://svn.whatwg.org/webapps@2153 340c8d12-0b0e-0410-8428-c7bf67bfef74
  • Loading branch information...
Hixie committed Sep 4, 2008
1 parent bf9bca6 commit b8e512670542d102eedf8f8b0de34f22e783b8bd
Showing with 196 additions and 45 deletions.
  1. +133 −43 index
  2. +63 −2 source
176 index
@@ -7535,9 +7535,10 @@ http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C%21DOCTYPE%20html%3E..
<code><a href="#meta0">meta</a></code>, <code><a
href="#object">object</a></code>,<!-- param?
XXX--> <code><a
href="#select">select</a></code>, and <code>textarea</code> elements in
that document that have a <code title="">name</code> attribute whose value
is equal to the <var title="">name</var> argument (in a <a
href="#select">select</a></code>, and <code><a
href="#textarea">textarea</a></code> elements in that document that have a
<code title="">name</code> attribute whose value is equal to the <var
title="">name</var> argument (in a <a
href="#case-sensitive">case-sensitive</a> manner), in <a
href="#tree-order">tree order</a>.


readonly attribute <a href="#htmlcollection0">HTMLCollection</a> <span title=dom-input-labels>labels</span>;

void <span title=dom-input-select>select</span>();
void <span title=dom-input-stepUp>stepUp</span>(in int n);
void <span title=dom-input-stepDown>stepDown</span>(in int n);

<code><a href="#option">option</a></code> element). ... argument
processing ...

<h4 id=the-textarea><span class=secno>4.9.10 </span>The
<code>textarea</code> element</h4>
<h4 id=the-textarea><span class=secno>4.9.10 </span>The <dfn
id=textarea><code>textarea</code></dfn> element</h4>

<dl class=element>
<dt>Categories

<dd><a href="#phrasing0">Phrasing content</a>.

<dd><a href="#interactive1">Interactive content</a>.

<dt>Contexts in which this element may be used:

<dd>Where <a href="#phrasing0">phrasing content</a> is expected.

<dt>Content model:

<dd>Text.

<dt>Element-specific attributes:

<dd><code title=attr-textarea-accept>accept</code>

<dd><code title=attr-textarea-autofocus>autofocus</code>

<dd><code title=attr-textarea-cols>cols</code>

<dd><code title=attr-textarea-disabled>disabled</code>

<dd><code title=attr-textarea-form>form</code>

<dd><code title=attr-textarea-inputmode>inputmode</code>

<dd><code title=attr-textarea-maxlength>maxlength</code>

<dd><code title=attr-textarea-name>name</code>

<dd><code title=attr-textarea-pattern>pattern</code>

<dd><code title=attr-textarea-readonly>readonly</code>

<dd><code title=attr-textarea-required>required</code>

<dd><code title=attr-textarea-rows>rows</code>

<dd><code title=attr-textarea-wrap>wrap</code>

<dt>DOM interface:

<dd>
<pre
class=idl>interface <dfn id=htmltextareaelement>HTMLTextAreaElement</dfn> : <a href="#htmlelement">HTMLElement</a> {
attribute DOMString <span title=dom-textarea-accept>accept</span>;
attribute boolean <span title=dom-textarea-autofocus>autofocus</span>;
attribute unsigned long <span title=dom-textarea-cols>cols</span>;
attribute boolean <span title=dom-textarea-disabled>disabled</span>;
readonly attribute <a href="#htmlformelement">HTMLFormElement</a> <span title=dom-textarea-form>form</span>;
attribute DOMString <span title=dom-textarea-inputmode>inputmode</span>;
attribute long <span title=dom-textarea-maxLength>maxLength</span>;
attribute DOMString <span title=dom-textarea-name>name</span>;
attribute DOMString <span title=dom-textarea-pattern>pattern</span>;
attribute boolean <span title=dom-textarea-readOnly>readOnly</span>;
attribute boolean <span title=dom-textarea-required>required</span>;
attribute unsigned long <span title=dom-textarea-rows>rows</span>;
attribute DOMString <span title=dom-textarea-wrap>wrap</span>;

readonly attribute DOMString <span title=dom-textarea-type>type</span>;
attribute DOMString <span title=dom-textarea-defaultValue>defaultValue</span>;
attribute DOMString <span title=dom-textarea-value>value</span>;

readonly attribute <a href="#htmlcollection0">HTMLCollection</a> <span title=dom-textarea-labels>labels</span>;

readonly attribute boolean <span title=dom-textarea-willValidate>willValidate</span>;
readonly attribute <span>ValidityState</span> <span title=dom-textarea-validity>validity</span>;
readonly attribute DOMString <span title=dom-textarea-validationMessage>validationMessage</span>;
boolean <span title=dom-textarea-checkValidatity>checkValidity</span>();
void <span title=dom-textarea-setCustomValidity>setCustomValidity</span>(in DOMString error);

void <span title=dom-textarea-dispatchChange>dispatchChange</span>();
void <span title=dom-textarea-dispatchFormChange>dispatchFormChange</span>();
};</pre>
</dl>
<!-- XXX add selectionStart and company -->

<p class=big-issue>...

<h4 id=the-output><span class=secno>4.9.11 </span>The <code>output</code>
element</h4>

<p>Mostly for historical reasons, in addition to the <a
href="#browsing1">browsing context</a>'s <a href="#a-selection" title="the
selection">selection</a>, each <code>textarea</code> and <code><a
selection">selection</a>, each <code><a
href="#textarea">textarea</a></code> and <code><a
href="#input0">input</a></code> element has an independent selection.
These are the <dfn id=text-field title="text field selection">text field
selections</dfn>.
<p class=big-issue>When we define HTMLTextAreaElement and HTMLInputElement
we will have to add the IDL given below to both of their IDLs.

<p>The <code><a href="#input0">input</a></code> and <code>textarea</code>
elements define four members in their DOM interfaces for handling their
text selection:
<p>The <code><a href="#input0">input</a></code> and <code><a
href="#textarea">textarea</a></code> elements define four members in their
DOM interfaces for handling their text selection:

<pre
class=idl> void <a href="#select2" title="dom-textarea/input-select">select</a>();
<!-- XXX also add textLength? it seems to be widely used -->

<p>These methods and attributes expose and control the selection of
<code><a href="#input0">input</a></code> and <code>textarea</code> text
fields.
<code><a href="#input0">input</a></code> and <code><a
href="#textarea">textarea</a></code> text fields.

<p>The <dfn id=select2
title="dom-textarea/input-select"><code>select()</code></dfn> method must
<pre>var selectionText = control.value.substring(control.selectionStart, control.selectionEnd);</pre>

<p>...where <var title="">control</var> is the <code><a
href="#input0">input</a></code> or <code>textarea</code> element.</p>
href="#input0">input</a></code> or <code><a
href="#textarea">textarea</a></code> element.</p>
</div>

<p>Characters with no visible rendering, such as U+200D ZERO WIDTH JOINER,
<code><a href="#option">option</a></code> elements' <code
title=dom-option-defaultSelected>defaultSelected</code> DOM attribute as
well as the <code title=dom-option-selected>selected</code> DOM
attribute; for <code>textarea</code> elements this means updating the
<code title=dom-textarea-defaultValue>defaultValue</code> DOM attribute
as well as the <code title=dom-textarea-value>value</code> DOM
attribute. (Updating the <code title="">default*</code> DOM attributes
causes content attributes to be updated as well.)
attribute; for <code><a href="#textarea">textarea</a></code> elements
this means updating the <code
title=dom-textarea-defaultValue>defaultValue</code> DOM attribute as
well as the <code title=dom-textarea-value>value</code> DOM attribute.
(Updating the <code title="">default*</code> DOM attributes causes
content attributes to be updated as well.)
</dd>
<!-- XXX something about not supporting resizing? -->
</dl>

<dl class=switch>
<dt>If the <a href="#current2">current target element</a> is a text
field (e.g. <code>textarea</code>, or an <code><a
href="#input0">input</a></code> element with <code
field (e.g. <code><a href="#textarea">textarea</a></code>, or an
<code><a href="#input0">input</a></code> element with <code
title="">type="text"</code><!--XXX xref-->)

<dd>The user agent must insert the data associated with the

<dl class=switch>
<dt>If the <a href="#current2">current target element</a> is a text
field (e.g. <code>textarea</code>, or an <code><a
href="#input0">input</a></code> element with <code
field (e.g. <code><a href="#textarea">textarea</a></code>, or an
<code><a href="#input0">input</a></code> element with <code
title="">type="text"</code><!--XXX xref-->), and a <code
title=event-drop><a href="#drop">drop</a></code> event was fired in
the previous step, and the <a href="#current3">current drag
selection from the DOM.

<dt>If the <a href="#current2">current target element</a> is a text
field (e.g. <code>textarea</code>, or an <code><a
href="#input0">input</a></code> element with <code
field (e.g. <code><a href="#textarea">textarea</a></code>, or an
<code><a href="#input0">input</a></code> element with <code
title="">type="text"</code><!--XXX xref-->), and a <code
title=event-drop><a href="#drop">drop</a></code> event was fired in
the previous step, and the <a href="#current3">current drag

<dt>RCDATA elements

<dd><code><a href="#title1">title</a></code>, <code>textarea</code>
<dd><code><a href="#title1">title</a></code>, <code><a
href="#textarea">textarea</a></code>

<dt>Foreign elements


<p>A single U+000A LINE FEED (LF) character may be placed immediately after
the <span title=syntax-start-tag>start tag</span> of <code><a
href="#pre">pre</a></code> and <code>textarea</code> elements. This does
not affect the processing of the element. The otherwise optional U+000A
LINE FEED (LF) character <em>must</em> be included if the element's
contents start with that character (because otherwise the leading newline
in the contents would be treated like the optional newline, and ignored).
href="#pre">pre</a></code> and <code><a
href="#textarea">textarea</a></code> elements. This does not affect the
processing of the element. The otherwise optional U+000A LINE FEED (LF)
character <em>must</em> be included if the element's contents start with
that character (because otherwise the leading newline in the contents
would be treated like the optional newline, and ignored).

<div class=example>
<p>The following two <code><a href="#pre">pre</a></code> blocks are
<code><a href="#section">section</a></code>, <code><a
href="#select">select</a></code>, <code>spacer</code>, <code><a
href="#style1">style</a></code>, <code><a
href="#tbody">tbody</a></code>, <code>textarea</code>, <code><a
href="#tbody">tbody</a></code>, <code><a
href="#textarea">textarea</a></code>, <code><a
href="#tfoot0">tfoot</a></code>, <code><a
href="#thead0">thead</a></code>, <code><a
href="#title1">title</a></code>, <code><a href="#tr">tr</a></code>,

<p>If the <a href="#form-element"><code title="">form</code> element
pointer</a> is not null, then <a href="#associated"
title=concept-form-association>associate</a> the newly created
<code>textarea</code> element with the <code><a
title=concept-form-association>associate</a> the newly created <code><a
href="#textarea">textarea</a></code> element with the <code><a
href="#form">form</a></code> element pointed to by the <a
href="#form-element"><code title="">form</code> element pointer</a>.</p>


<p>If the next token is a U+000A LINE FEED (LF) character token, then
ignore that token and move on to the next one. (Newlines at the start of
<code>textarea</code> elements are ignored as an authoring convenience.)</p>
<code><a href="#textarea">textarea</a></code> elements are ignored as an
authoring convenience.)</p>

<p>Then, collect all the character tokens that the tokeniser returns
until it returns a token that is not a character token, or until it
<!-- XXX when we get around to it, add
eventsource -->
<p>If <var title="">current node</var> is a <code><a
href="#pre">pre</a></code> <code>textarea</code>, or
<code>listing</code> element, append a U+000A LINE FEED (LF)
character.</p>
href="#pre">pre</a></code> <code><a
href="#textarea">textarea</a></code>, or <code>listing</code>
element, append a U+000A LINE FEED (LF) character.</p>

<p>Append the value of running the <a href="#html-fragment">HTML
fragment serialization algorithm</a> on the <var title="">current

<p class=note>It is possible that the output of this algorithm, if parsed
with an <a href="#html-0">HTML parser</a>, will not return the original
tree structure. For instance, if a <code>textarea</code> element to which
a <code title="">Comment</code> node has been appended is serialized and
the output is then reparsed, the comment will end up being displayed in
the text field. Similarly, if, as a result of DOM manipulation, an element
tree structure. For instance, if a <code><a
href="#textarea">textarea</a></code> element to which a <code
title="">Comment</code> node has been appended is serialized and the
output is then reparsed, the comment will end up being displayed in the
text field. Similarly, if, as a result of DOM manipulation, an element
contains a comment that contains the literal string "<code
title="">--&gt;</code>", then when the result of serializing the element
is parsed, the comment will be truncated at that point and the rest of the
title="">context</var> element, as follows:</p>

<dl class=switch>
<dt>If it is a <code><a href="#title1">title</a></code> or
<code>textarea</code> element
<dt>If it is a <code><a href="#title1">title</a></code> or <code><a
href="#textarea">textarea</a></code> element

<dd>Set the <a href="#content4">content model flag</a> to the RCDATA
state.
65 source

readonly attribute <span>HTMLCollection</span> <span title="dom-input-labels">labels</span>;

void <span title="dom-input-select">select</span>();
void <span title="dom-input-stepUp">stepUp</span>(in int n);
void <span title="dom-input-stepDown">stepDown</span>(in int n);

</p>


<h4>The <code>textarea</code> element</h4>
<h4>The <dfn><code>textarea</code></dfn> element</h4>

<dl class="element">
<dt>Categories</dt>
<dd><span>Phrasing content</span>.</dd>
<dd><span>Interactive content</span>.</dd>
<dt>Contexts in which this element may be used:</dt>
<dd>Where <span>phrasing content</span> is expected.</dd>
<dt>Content model:</dt>
<dd>Text.</dd>
<dt>Element-specific attributes:</dt>
<dd><code title="attr-textarea-accept">accept</code></dd>
<dd><code title="attr-textarea-autofocus">autofocus</code></dd>
<dd><code title="attr-textarea-cols">cols</code></dd>
<dd><code title="attr-textarea-disabled">disabled</code></dd>
<dd><code title="attr-textarea-form">form</code></dd>
<dd><code title="attr-textarea-inputmode">inputmode</code></dd>
<dd><code title="attr-textarea-maxlength">maxlength</code></dd>
<dd><code title="attr-textarea-name">name</code></dd>
<dd><code title="attr-textarea-pattern">pattern</code></dd>
<dd><code title="attr-textarea-readonly">readonly</code></dd>
<dd><code title="attr-textarea-required">required</code></dd>
<dd><code title="attr-textarea-rows">rows</code></dd>
<dd><code title="attr-textarea-wrap">wrap</code></dd>
<dt>DOM interface:</dt>
<dd>
<pre class="idl">interface <dfn>HTMLTextAreaElement</dfn> : <span>HTMLElement</span> {
attribute DOMString <span title="dom-textarea-accept">accept</span>;
attribute boolean <span title="dom-textarea-autofocus">autofocus</span>;
attribute unsigned long <span title="dom-textarea-cols">cols</span>;
attribute boolean <span title="dom-textarea-disabled">disabled</span>;
readonly attribute <span>HTMLFormElement</span> <span title="dom-textarea-form">form</span>;
attribute DOMString <span title="dom-textarea-inputmode">inputmode</span>;
attribute long <span title="dom-textarea-maxLength">maxLength</span>;
attribute DOMString <span title="dom-textarea-name">name</span>;
attribute DOMString <span title="dom-textarea-pattern">pattern</span>;
attribute boolean <span title="dom-textarea-readOnly">readOnly</span>;
attribute boolean <span title="dom-textarea-required">required</span>;
attribute unsigned long <span title="dom-textarea-rows">rows</span>;
attribute DOMString <span title="dom-textarea-wrap">wrap</span>;

readonly attribute DOMString <span title="dom-textarea-type">type</span>;
attribute DOMString <span title="dom-textarea-defaultValue">defaultValue</span>;
attribute DOMString <span title="dom-textarea-value">value</span>;

readonly attribute <span>HTMLCollection</span> <span title="dom-textarea-labels">labels</span>;

readonly attribute boolean <span title="dom-textarea-willValidate">willValidate</span>;
readonly attribute <span>ValidityState</span> <span title="dom-textarea-validity">validity</span>;
readonly attribute DOMString <span title="dom-textarea-validationMessage">validationMessage</span>;
boolean <span title="dom-textarea-checkValidatity">checkValidity</span>();
void <span title="dom-textarea-setCustomValidity">setCustomValidity</span>(in DOMString error);

void <span title="dom-textarea-dispatchChange">dispatchChange</span>();
void <span title="dom-textarea-dispatchFormChange">dispatchFormChange</span>();
};</pre>
</dd>
</dl>

<!-- XXX add selectionStart and company -->

<p class="big-issue">...</p>


<h4>The <code>output</code> element</h4>

0 comments on commit b8e5126

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