[whatwg] datalist @exclusive [was: Please reconsider: Set restricted palette for input type=color]

Jonas Sicking jonas at sicking.cc
Tue Mar 8 16:51:25 PST 2011

On Tue, Mar 8, 2011 at 10:46 AM, Markus Ernst <derernst at gmx.ch> wrote:
> Am 08.03.2011 19:02 schrieb Anne van Kesteren:
>> On Tue, 08 Mar 2011 12:26:56 +0100, Jukka K. Korpela
>> <jkorpela at cs.tut.fi> wrote:
>>> For example, consider a date picker. Quite often, whether trying to
>>> make dates or selling flights, there is a known set of
>>> (non-consecutive) days that are possible, so we would like to write, say,
>>> <input type="date" id="date" name="date"
>>> value="2011-04-01" list="datelist">
>>> <datalist id="datelist">
>>> <option value="2011-04-01" label="April 1st">
>>> <option value="2011-04-08" label="April 8th">
>>> <option value="2011-04-09" label="April 9th">
>>> </datalist>
>>> This is currently conforming, though no browser seems to make use of
>>> the datalist. A good implementation would open up a calendar for
>>> April, with only days 1, 8, 9 selectable and day 1 highlighted. Many
>>> existing applications use such interfaces, so there is apparent need
>>> for them.
>> Agreed that we should fix this, but note that <datalist> is for
>> additional or pre-suggested options. The idea is that the user still has
>> choice so the other days should be selectable too.
> Which means in the mentioned use case, that the user can select a date when
> no flight is actually available. We can of course validate the input and ask
> the user to select another date, but still this results in sub-optimal user
> experience (and extra JS code).
> The "exclusive" attribute suggested by Jukka K. Korpela for the datalist
> element would change this behaviour, making unavailable options
> unselectable.
> I hope very much that this proposal will make it into the standard. Except
> for date/time and color input elements, I can also imagine use cases
> regarding the range element (if a part of the range is not available).

I'm having a little bit hard of a time figuring out what a good UI
would look like in the general case. I.e. what should the UI look like

<input type="date" id="date" name="date"
value="2011-04-01" list="datelist" exclusive>
<datalist id="datelist">
<option value="2011-04-01" label="April 1st">
<option value="2011-04-08" label="April 8th">
<option value="2011-04-09" label="April 9th">
<option value="2012-06-06" label="National Day of Sweden">

Do you allow flipping between only the months which have any available
dates in them using the next/previous month buttons in the date
picker? That seems like it could be somewhat confusing. And how/where
do you show the labels?

Or do you do some type of dropdown without a date picker at all? How
would that be different from just a <select>?

There's not really any point in adding a feature unless we can also
think of good UI for it. We don't need to specify UI (in fact, we
shouldn't), but we have to make sure that good UI is possible. Authors
need to be able to depend on that the UI will look decent and blend in
with their page, otherwise they won't want to use the feature.

/ Jonas

More information about the whatwg mailing list