Is there a way to select all refinementList options that match search result?

Open Q&A
,
#1

I was able to create a checkbox that will only check all the refinementList options in a specific refinementList that have span.ais-RefinementList-labelText > span.ais-Highlight right after the input. Using the following jQuery…

      $('.select-all').on('click', function() {
        var shouldCheck = $(this).is(":checked");
        $('.allAbilitiesEffectType-wrap .ais-RefinementList > ul.ais-RefinementList-list > li.ais-RefinementList-item > label > input[type="checkbox"]:has(+ span.ais-RefinementList-labelText > span.ais-Highlight)').each(function(i, el) {
          $(el).prop('checked', shouldCheck);
          $(el).closest('.ais-RefinementList-item').addClass('ais-RefinementList-item--selected');
        });
      });

It appears to work perfectly as far as it checks all the correct checkboxes after clicking the checkbox with the .select-all class and it adds the ais-RefinementList-item–selected class to the correct elements. However it does not actually filter any of the results, I have to check them each manually for that to work for some reason.

Can anyone explain to me what I need to do to get it to also filter the results based on the checkboxes that it checks all at once?

Here is a screenshot of a suggestion I received for my website that should help you understand exactly what I am talking about…
image

Thanks,

Chris

#2

Hi @cmarabate ,

If I understand your issue correctly, you would like to be able to automatically select all the filters that match a search on that attribute, is that correct?

Indeed, the way you are interacting with the UI is not going to update the internal filters within InstantSearch. Instead I would advise you to use the configure widget: configure | InstantSearch.js | API parameters | API Reference | Algolia Documentation

The idea would be that on click, you get the list of all displayed filter and apply them to InstantSearch using the configure widget. This will also automatically update the filters in the refinementList.

Let me know if that helps you move forward!
Best,