Correct vertical tab does not focus on form validation

Created on 26 September 2017, over 6 years ago
Updated 25 May 2023, about 1 year ago

When in a form where required fields appear in a Vertical Tab, if a field that is required isn't filled in, or skipped by accident, and another tab is accessed, the tab with the validation error is not open, which can sometimes lead to confusion.

I've created a patch that will check for the first element it finds that is required and is invalid, and selects the correct tab, focusing it. I've tested this out and it seems to work well for the scenario.

Reproduce

To reproduce, you need to have a field inside a vertical tab that can fail validation. Usually, required and similarly validated fields are not inside tabsets in core

The easiest way to reproduce is apply 2911932-30-test-only.patch from #30, enable form_test (must have

$settings['extension_discovery_scan_tests'] = TRUE;

).

Then go to form-test/group-vertical-tabs and enter "bad" into the input in "Second group element", go to an different tab, then submit to trigger an error.
It not working === it does not switch to second tab, where the error is

Problem Happening
https://youtu.be/kYnLIIWCQes

Problem Fixed
https://youtu.be/Ydr06gybiFI

Note that this is specific to the Vertical Tabs render element provided by Drupal core. Any issues occurring in contrib elements, such as those provided by Field Group, will need to be filed as issues with the contirb module providing them.

🐛 Bug report
Status

Fixed

Version

9.5

Component
Javascript 

Last updated 38 minutes ago

Created by

🇦🇪United Arab Emirates leslie.cordell Dubai

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.

  • JavaScript

    Affects the content, performance, or handling of Javascript.

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.

Production build 0.69.0 2024