[whatwg] Errormessages in forms

[Keryx Web]

Now it has been a while since anyone proposed a new element...

But I can't remember if this has been discussed in any detail...

So here it comes!

I suggest that we investigate if an errormsg element could be useful. It 
should be a sibling element to label and have a similar for-attribute.

A simple use case: It is getting quite common to have the following:

<label for="myfield">Instructions
   <strong class="error"> Must be a valid  value</strong>
</label>
<input id="myfield" etc />

But presentationwise it should be displayed like this:

Instructions  [ (input) ] Must be a valid value

Using today's techniques all solutions come out a bit hackish. CSS 3 
layout modules (far into the future) might alleviate some of that, but 
it will not provide any semantics. By adding a designated element we 
also gain the possibility of moving the error messages out of the label 
elements, without loosing their association to the input elements. 
Design becomes easier and new designs become possible.

And by adding a new element the following two additional benefits could 
be achieved:

1. A default hook for errormessages from the UA. I.e. if a field has an 
associated errormsg-element the UA knows exactly where to put its messages.

Consider this markup:

<label for="foo">Instructions</label>
<input id="foo" required... >
<errormsg for="foo" />

If a user submits the form with non-valid field and no JS solution 
intercepts the UA SHOULD look for errormsg-elements and put its error 
messages there. That means a designer keeps some control even if he 
relies solely upon the UA's built in handling of invalid form values.

2. Assistive technology can use this additional semantics and it is not 
hard to imagine how that could lead to better user experiences.

For completeness sake this element should be treated just like label in 
most cases, i.e, if clicked it should fire events, set checkboxes and 
radiobuttons, etc, just like clicking a label element would. And it 
would also have a similar function in the DOM.


Perhaps the era of adding new elements has passed HTML 5 by, but I 
thought this could really be useful.


Lars Gunther