[whatwg] Combo Boxs, once again...

[Ian Hickson]

On Thu, 1 Jul 2004, Matthew Raymond wrote:
>
> Here are seven different ways to do combo boxes with their pros and
> cons. I recommend prefer the last one. Let me know if I made any typos
> or omitted obvious pros or cons.
>
> === Sample #1 ===
>
> Cons:
>     Degrades to a drop-down, which is a serious problem.

So serious that solutions to this effect were removed from the draft.
Twice. :-)


> === Sample #2 ===
>
> <ignore>
>    <input type="text" name="combo1" value="something" />
>    <label for="select1"> or select from this list: </label>
> </ignore>
> <select editable name="combo1" type="text" value="something" id="select1">
>    <option>First Option</option>
>    <option>Second Option</option>
>    <option>Third Option</option>
> </select>
>
> Cons:
>     Many oppose extending the use of the "type" attribute.
>     Legacy UAs submit multiple values to the server.
>     Introduces a new element that did not previously exist.

Specifically, introduces a new element whose semantics are purely version
control, which I really don't like.

Also, this method makes it impossible to associate a label with the input
in the legacy case and the select in the WF2 case.


> === Sample #3 ===
...and
> === Sample #5 ===
>
> Cons:
>     Abuses repetition templates.

I really don't like that.


> === Sample #4 ===
>
> <input type="text" name="combo1" value="something" list="select1" />
> <ignore>
>    <label for="select1"> or select from this list: </label>
>    <select name="combo1" id="select1">
>      <option>First Option</option>
>      <option>Second Option</option>
>      <option>Third Option</option>
>    </select>
> </ignore>
>
> Cons:
>     Legacy UAs submit multiple values to the server.
>     Introduces a new element that did not previously exist.
>     <ignore> element required even in WF2-only cases.

This is closer to ideal, although it still has this version-control-only
element, except in this case it is even worse because it doesn't really
mean ignore, it means "ignore only for rendering". It's basically as bad
as <center> at this point. :-)


> === Sample #6 ===
>
> WF2 + LEGACY:
>
> <input type="text" name="combo1" value="something" list="list1" />
> <datalist id="list1">
>    <label for="select1"> or select from this list: </label>
>    <select name="combo1" id="select1">
>      <option>First Option</option>
>      <option>Second Option</option>
>      <option>Third Option</option>
>    </select>
> </datalist>
>
> Cons:
>     Requires abuse of markup for graceful degradation.

I'm not sure why you think this is an abuse. <datalist>'s semantics are
"here is a list of options, or, if you don't know how to handle those, an
alternate representation of the form for you".


> === Sample #7 ===

...has the same problem with <ignore> as #4, and is otherwise equivalent
to #6.

I picked #6.

-- 
Ian Hickson               U+1047E                )\._.,--....,'``.    fL
http://ln.hixie.ch/       U+263A                /,   _.. \   _\  ;`._ ,.
Things that are impossible just take longer.   `._.-(,_..'--(,_..'`-.;.'