No Code Attached Yet a11y bug
avatar crystalenka
crystalenka
23 Apr 2022

Steps to reproduce the issue

  1. Create a custom field with type "radio". Add at least two options.
  2. Create a custom field with type "subform". Add your radio field.
  3. In an article where the subform field is available, create new rows.

Expected result

In the new rows, the labels of each radio button have the appropriate for value to associate with the radio input so screenreaders can "see" it properly, and one can click the label to select a radio.

Actual result

The label has a for value that is incorrect—it does not match the generated name of the radio input.

For example:

<input class="form-check-input" type="radio" id="jform_com_fields__my_subform__row10__field1322" name="jform[com_fields][my-subform][row10][field132]" value="value">

and

<label for="jform_com_fields__my_subform__rowX__field1322" class="form-check-label">Text</label>

Note the difference between row10 and rowX.

This problem is resolved on saving the item with the additional rows.

System information (as much as possible)

Joomla 4.1.2
PHP 8.0

Additional comments

This is an accessibility and usability issue. Seems to be JS related but the code behind subforms is dark magic to me so I am not sure where to look to start debugging. ?

avatar crystalenka crystalenka - open - 23 Apr 2022
avatar joomla-cms-bot joomla-cms-bot - change - 23 Apr 2022
Labels Added: No Code Attached Yet
avatar joomla-cms-bot joomla-cms-bot - labeled - 23 Apr 2022
avatar richard67 richard67 - change - 23 Apr 2022
Labels Added: a11y
avatar richard67 richard67 - labeled - 23 Apr 2022
avatar chmst chmst - change - 17 Feb 2023
Labels Added: bug
avatar chmst chmst - labeled - 17 Feb 2023

Add a Comment

Login with GitHub to post a comment