WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Using labels or table headers on nested editable elements inside data cells?

for

From: chaals
Date: Jan 10, 2017 10:02PM

10.01.2017, 16:15, "Graham Armfield" < <EMAIL REMOVED> >:
> I know the code provided was just an example, but what is it that
> differentiates the various rows of inputs in this table setup?

In effect, it's a template, and the distinguishing row header - "key" is a term sometimes used for database tables - is the value of the name input in the first cell of each row.

> Surely you'd
> also need some way of tying the age/number field with the name field
> otherwise the prompt is ambiguous.

That is relying on the basic table property that you move across tables in rows. Which isn't programatically determinable here, but could be if the algorithm were good enough. I'm not sure that it is - anyone who is interested would be welcome to check it in the HTML spec.

> In the corresponding form not laid out in a table I'd be using fieldset and
> legend to link the inputs. But here, could you also have the id of the name
> field included in the aria-labelledby? Has anyone tried doing that.

yeah, should be feasible, or you can use th elements and rely on the algorithm.

From memory you can't wrap the input and use it as a label for another input - but then, there isn't an HTML way outside ARIA to use multiple labels, as I recall.

> I'd want to test this in mobile situations with Voiceover and Talkback too.

Sure.

cheers

-- 
Charles McCathie Nevile - standards - Yandex
<EMAIL REMOVED> - - - Find more at http://yandex.com