[whatwg] Placeholder option for text input boxes

[Tab Atkins Jr.]

On Fri, Oct 3, 2008 at 10:37 AM, Garrett Smith <dhtmlkitchen at gmail.com>wrote:

> On Fri, Oct 3, 2008 at 8:05 AM, Tab Atkins Jr. <jackalmage at gmail.com>
> wrote:
> > On Fri, Oct 3, 2008 at 9:32 AM, Garrett Smith <dhtmlkitchen at gmail.com>
> > wrote:
> >>
> >> On Thu, Oct 2, 2008 at 4:34 PM, Tab Atkins Jr. <jackalmage at gmail.com>
> >> wrote:
> >> > On Thu, Oct 2, 2008 at 6:27 PM, Brenton Strine
> >> > <Brenton.Strine at citrix.com>
> >> > wrote:
> >> >>
> >> >> On Tue, Sep 30, 2008 at 11:36 AM, Andy Lyttle <whatwg at phroggy.com>
> >> >> wrote:
> >>
>
>
> >> > iota.  This leans me even more toward a CSS solution.  I'll just bite
> >> > the
> >> > bullet and bring it up to the CSS WG.
> >> >
> >>
> >> Are you proposing that placeholder could be a positioned object, such
> >> as an image?
> >
> > Not entirely sure what you're suggesting here, but maybe?
>
> I feel the same way about what you wrote. (?)


Then I'll expand.  I guess you're late to the thread?  Not that it's a
problem, I just assumed that you'd seen the mail I sent earlier.


> > My suggestion was
> > put forward up above - I would prefer if the placeholder text was
> replaced
> > content.  You set a CSS rule (haven't decided the best way to handle this
> > yet) that suppresses the display of a label and instead uses the textual
> > content of the label as a placeholder.
> >
>
>
> A <label> element?


Yes.  My idea is based on the fact that on every current use of
placeholder-like functionality I've ever seen, the placeholder text was
semantically a label, and was in fact used in place of a label.  The
majority of suggestions put forth in this thread have the same property -
the text that they're packing into @placeholder is semantically a <label>,
and should actually be put there - it's merely a desire to change the
display of the label that moves them to put it into @placeholder.

Thus, this seems rather straightforwardly a CSS issue.  You code up an
ordinary, semantic form with <label> and such, then some CSS rule takes over
and suppresses the appearance of the <label>, but displays the textual
content of the <label> within the <input> (or <textarea>).

Some searching finally let me find the article where I found this technique
put into practice with Javascript.  Jeremy Boles produced the example that I
first saw, but he appears to have taken down his blog.  However, A List
Apart Issue #229 covered it as well, and they still have a working page.
[1]  My idea is that this should be doable through CSS rather than only
through Javascript at current.

[1]: http://alistapart.com/articles/makingcompactformsmoreaccessible

~TJ
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.whatwg.org/pipermail/whatwg-whatwg.org/attachments/20081003/c20965eb/attachment.htm>