Accessibilité des blocs répétables

[inseo]

Spécifications

Le bloc répétable ne contient qu'un seul champ

1. Mettre un attribut id unique sur la légende du fieldset ("Enfants") ;
2. Mettre un attribut id unique sur l'étiquette de chaque champ ("prénom 1", "prénom 2") ;
   note: On conserver la numérotation des étiquettes de champ
3. Mettre un attribut aria-labelledby sur chaque champ ;
4. Donner comme valeur à l'attribut aria-labelledby les identifiants de la légende et de l'étiquette du champ. Les identifiants sont séparés par des espaces.

<legend id="leg-1">Enfants</legend>
<label id="lab-1">prénom 1</label>
<input aria-labelledby="leg-1 lab-1">
<label id="lab-2">prénom 2</label>
<input aria-labelledby="leg-1 lab-2">

Le bloc répétable contient plusieurs champs

1. Mettre un attribut id unique sur la légende du fieldset ("petits enfants 1", "petits enfants 2") qui regroupe les champs ;
2. Mettre un attribut id unique sur l'étiquette de chaque champ ("prénom", "nom") ;
   note: On supprime la numérotation des étiquettes de champ
3. Mettre un attribut aria-labelledby sur chaque champ ;
4. Donner comme valeur à l'attribut aria-labelledby les identifiants de la légende et de l'étiquette du champ. Les identifiants sont séparés par des espaces.

<legend id="leg-field-1">petits enfants 1</legend>
<label id="lab-1-field-1">prénom</label>
<input aria-labelledby="leg-field-1 lab-1-field-1">
<label id="lab-2-field-1">prénom</label>
<input aria-labelledby="leg-field-1 lab-2-field-1">
(…)
<legend id="leg-field-2">petits enfants 2</legend>
<label id="lab-1-field-2">prénom</label>
<input aria-labelledby="leg-field-2 lab-1-field-2">
<label id="lab-2-field-2">prénom</label>
<input aria-labelledby="leg-field-2 lab-2-field-2">

La liste des champs en erreur

Le bloc répétable ne contient qu'un seul champ

L'intitulé du lien reprend la légende du bloc répétable suivie de l'étiquette du champ :

• Enfants - prénom 1
• Enfants - prénom 2, par exemple.

Le bloc répétable contient plusieurs champs

L'intitulé du lien reprend la légende du groupement de champs suivie de l'étiquette du champ :

• petits enfants 1 - prénom,
• petits enfants 2 - prénom, par exemple.