Radio button accessibility and button can disappear

Created on 16 February 2017, over 8 years ago
Updated 2 June 2025, 29 days ago

Bug that I initially saw

With the popular bootstrap theme, the radio buttons in the select columns are missing.

The fault is both Diff and Bootstrap - and arguably more from Bootstrap (and I will raise an issue on that project next). However I think there is a worthwhile change to make in this module.

Underlying cause in Diff

In function buildSelectColumn, the Diff module doesn't set a title. Drupal documentation for template_preprocess_form_element states

If the #title property is not set, then the label and any required marker will not be output, regardless of the #title_display or #required values. This can be useful in cases such as the password_confirm element, which creates children elements that have their own labels and required markers, but the parent element should have neither. Use this carefully because a field without an associated label can cause accessibility challenges.

I don't have much experience of accessibility, but the above quote makes me think that for accessibility it is probably better to have a title set, even though #title_display is 'invisible'. I guess that a screen reader might read out the invisible title to help a partially-sighted user understand the purpose of the radio. Without the title, users might have no clue what the radio is for if they can't see the visual alignment.

Setting the title also fixes bug where the buttons disappear with Bootstrap theme.

Underlying cause in Bootstrap

In FormElement::preprocessElement Bootstrap chooses to convert a single radio field into a label. (Not sure why - maybe as an optimisation to reduce HTML??) Unfortunately, the code doesn't first check that the label will actually be displayed.

🐛 Bug report
Status

Closed: outdated

Version

1.0

Component

User interface

Created by

🇬🇧United Kingdom adamps

Live updates comments and jobs are added and updated live.
  • Accessibility

    It affects the ability of people with disabilities or special needs (such as blindness or color-blindness) to use Drupal.

Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

  • 🇦🇺Australia acbramley

    I can see some other examples of radios with no title in core (e.g Tableselect) so closing this one out for now since the Bootstrap side was fixed.

Production build 0.71.5 2024