[Resolved] Views Filters select Parent Categories

[Author]

Posts

[rubenB]

Hi I have a taxonomy I would like to filter using Views filters, so that searching for any child term also includes in the search its parent terms.

For example my Taxonomy 'Minimum Age' has the structure
50+ > 55+ > 60+ > 65+
So if a user indicates they are 60+, the search should include 55+ and 50+, etc.

I'm trying to work out a jQuery solution, based on
https://toolset.com/forums/topic/view-filters-checkboxes-check-all-checkbox/
But modifying that solution that each checkbox should only select the previous sibling checkbox.
Replacing the .each() method with .prev() is proving too complicated for me!
Something like this?

$(document).ready(function() {
    $('.select_previous .js-wpv-filter-trigger').click(function(event) {  //on click 
        if(this.checked) { // check select status
            $(.prev('.select_previous  .js-wpv-filter-trigger')).each(function() { //trying to find the previous checkbox
                this.checked = true;  //and check it              
            });
        }     
        }
});

Sorry no good with Javascript!

Or should this be achieved with a different approach all together?

[Luo Yang]

Hello,

As you can see there isn't such a built-in feature within Toolset plugins, and it needs custom JS codes.

You are right, in your case, it needs to use .prev() selector, see jQuery document:
hidden link

I suggest you follow above document to setup your custom JS codes.

If you need more assistance for it, please provide a test site with the same problem, also point out the problem page URL and view URL, thanks

[rubenB]

Thanks for your quick reply !

I'll read into the jQuery documentation and see what I can figure out myself!

Otherwise I'll have a live site online in a week or two, and might bug you again if thats ok?

[Luo Yang]

OK, please update here when your test site is ready. thanks

[rubenB]

Wow I actually figured it out, kinda! Thanks for prodding me in the right direction and pointing me to the good documentation 🙂
These search filters are too confusing due to the nature of the content, and I'm not sure if this is actually even what I need to do... but I'm so glad I've got Toolset to help me do it!

jQuery(document).ready(function() {

// Check the Previous Checkboxes when they are wrapped in the .select_previous div eg for Minimum Age taxonomy
// Wrap the formgroup in .select previous div to apply this script
jQuery('.select_previous .js-wpv-filter-trigger').click(function() {
    if(this.checked) { // check select status

        jQuery(this).parent().parent().prev(".checkbox").children().children().trigger("click");
        //walking back up the tree to the previous checkbox
        //using trigger('click') instead of 'prop('checked' true)' as this method fires a new event so it can tick all the boxes
      };
    });

    // Add checked class to checkboxes label div, as the input is nested inside the label, can't target it with :checked
    jQuery('.js-wpv-filter-trigger').click(function() {
      if(this.checked) { // check select status
          jQuery(this).parent().addClass('checked');
          }
      else  { // check select status
          jQuery(this).parent().removeClass('checked');
          }
        })
        jQuery().trigger('click');

});

[Luo Yang]

Is this issue resolved?
Since it is a custom JS codes problem, if you need more assistance for it, please provide a test site with the same problem, also point out the problem page URL and view URL, I need to test it in a live website, thanks

[rubenB]

This issue is resolved now. Thank you!