Applying #states to a vertical tab does not update the vertical tabs menu

Created on 6 May 2011, over 13 years ago
Updated 8 January 2024, 11 months ago

Problem/Motivation

Applying the states API to a vertical tab removes the tab content, but not the link in the vertical tab menu:

Steps to reproduce:

$form['toggle_visible'] = array(
      '#type' => 'checkbox',
      '#title' => $this->t('Toggle visibility'),
      '#default_value' => FALSE,
    );
    $form['vertical_tabs1'] = array(
      '#type' => 'vertical_tabs',
      '#default_tab' => 'edit-details1',
    );
    $form['details1'] = array(
      '#type' => 'details',
      '#title' => $this->t('details1'),
      '#open' => TRUE,
      '#group' => 'vertical_tabs1',
      '#states' => array(
        'visible' => array(
          'input[name=toggle_visible]' => array('checked' => FALSE),
        ),
      ),
    );

Proposed resolution

Make states apply to the vertical tab and update the vertical tab menu accordingly.

Remaining tasks

  1. Write a patch
  2. Review
  3. Commit

User interface changes

States are applied to the vertical tab and update the vertical tab menu accordingly.

API changes

To be determined.

Data model changes

None.

Original report by Berdir:

See #767212-12: #states can't hide/show fieldsets .

The attached patch fixes it, it's probably a bit hackish, but that was the best I could come up with my limited JS skills :)

What it does is add a derived id (based on the fieldset id) to each vertical tab li element. Then it overrides the state:visibile handler for those fieldsets and instead hides/shows the corresponding button. It also switches back to the nearest fieldset if it is currently active when hidden again.

I guess it might be possible to pass the vertical_tab element somehow directly to that bind callback, which would make that id stuff unecessary.

🐛 Bug report
Status

Needs work

Version

11.0 🔥

Component
Javascript 

Last updated about 24 hours ago

Created by

🇨🇭Switzerland berdir Switzerland

Live updates comments and jobs are added and updated live.
  • Needs backport to D7

    After being applied to the 8.x branch, it should be considered for backport to the 7.x branch. Note: This tag should generally remain even after the backport has been written, approved, and committed.

  • Needs tests

    The change is currently missing an automated test that fails when run with the original code, and succeeds when the bug has been fixed.

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.71.5 2024