Expand children terms tree upon selecting parent

Created on 3 April 2017, over 7 years ago

Updated 14 May 2019, over 5 years ago

I've set up a taxonomy reference field in a content type using the term reference tree widget. Since the list of terms is rather long, it's starting minimized. However, upon selecting one of the top level terms, the children tree of that parent should open. I couldn't find an option for that, so I added a couple of lines to the js file.

// Slide toggle the list underneath when selected.
    $('.term-reference-tree-button + .form-type-checkbox > input', context).once('term-reference-tree-selexpand').change(function(event) {
        var event_target = $(event.target);
        if ( event_target.attr('checked') ) {
            $(this).parent().siblings('.term-reference-tree-button').toggleClass('term-reference-tree-collapsed');
            $(this).parent().siblings('ul').slideToggle('fast');
        }
    });

I am not sure if this conflicts with other options but may it help others who have similar client requests.

✨ Feature request

Status

Postponed

Version

1.0

Component

User interface

Created by

🇩🇪Germany broon Potsdam

Live updates comments and jobs are added and updated live.

Incomplete comments

Comments & Activities

Not all content is available!

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

Comment 12 months ago →

🇧🇪Belgium hansrossel

The html structure has changed a bit, so here is an updated version of the code.
You can also use it in a script.js file in your admin theme.

Drupal.behaviors.termReferenceTreeExpand = {
    attach: function(context, settings) {
      $('.field-widget-term-reference-tree .form-checkbox', context).once('term-ref-tree').change(function() {
        var isChecked = $(this).is(':checked');
        // Toggle the collapsed state of the term tree
        $(this).parent().parent().siblings('.term-reference-tree-button').toggleClass('term-reference-tree-collapsed');
        // Toggle the show/hide of the child term list
        $(this).parent().parent().siblings('.term-reference-tree-level').toggle(isChecked);
      });
    }
  };

contrib.social Blog FAQ Discussions

Production build 0.71.5 2024