[css3-ui] Expand coverage of the :invalid pseudoclass

Currently CSS3 UI provides four pseudoclasses that apply to form
elements and match based on their validity: :valid, :invalid,
:in-range, and :out-of-range. [1]

However, HTML5 provides nearly a dozen different ways that a form
element can be invalid. [2]  There is currently no way to match an
element based on its type of invalidity, beyond matching on the [type]
attribute and hoping you guessed right.

I propose an extension to CSS UI's :invalid pseudoclass to also allow
it in a functional form, :invalid().  This would accept a token
representing a particular type of invalidity.  The exact tokens used
would be defined by the document language (in practice, currently by
HTML5).

Though this part would be up to the whatwg to decide, I'd expect the
values that :invalid() would accept would be: value-missing,
type-mismatch, pattern-mismatch, too-long, range-underflow,
range-overflow, step-mismatch, and custom-error.

This proposal would not replace the :out-of-range and :in-range
pseudoclasses currently defined by CSS3 UI.  These are potentially
useful as a generic mechanism.

[1]: http://www.w3.org/TR/css3-ui/#pseudo-validity
[2]: http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#the-constraint-validation-api

~TJ

Received on Tuesday, 25 August 2009 16:56:30 UTC