WCAG compatible labeling for inputs
WCAG compatible labeling for inputs
fisharebest
Posts: 17Questions: 1Answers: 0
When an <input> is nested within its <label>, there is no need to use for="xx" / id="xx" to link them.
Datatables generates this style of markup for the input controls in the header/footer. For example, in the select page length option.
However, assistive technologies do not always recognise this structure, and it will currently fail WCAG validation (http://www.w3.org/TR/WCAG20-TECHS/F68.html).
<label><input ...></label>
Hence a feature request: Generate a suitable ids for these inputs. Perhaps based on the ID of the parent table. e.g.
<table id="my-table" ...>
...
<label for="my-table-suffix"><input id="my-table-suffix" ...></label>
...
</table>
This discussion has been closed.
Replies
I'm almost lost for words...! The structure DataTables uses, as you note, is valid and correct HTML as specified by the W3C. I can't understand why the W3C's WCAG would not consider that to be valid. I've used a number of screenreaders for testing and not had a problem with any of them in this area.
Think this might need a discussion on the WCAG mailing list to ask for clarification... I'm loathe to introduce extra markup and generated ids if they aren't needed as it just causes code bloat.
Allan
I know how you feel.
It just seemed easier to comply with the request than to justify/explain.
I'll either patch my local copy of DT or take it up with WCAG...
Thanks for answering.
Reading the smallprint, it seems that the current markup is valid. Test procedure 2b
Must be a faulty validator.
Sorry for wasting your time.
Phew :-). I knew the markup was valid HTML with the implicit link, but the document you linked above appears to imply that an explicit link must be used. Where did you find the small print saying that it is actually okay?
Allan