Facets searchbox widget doesn't work when multiple facets with this widget are shown

Created on 27 July 2022, almost 2 years ago
Updated 18 June 2024, 10 days ago

Problem/Motivation

When there are two facets using the Searchable list of checkboxes widget on the same page, it only works for the first one.

Steps to reproduce

When you place two different facets on a page with Search API view, e.g. like a product catalogue and set the Searchable list of checkboxes widget for both, it only works for the first one. E.g. I have a facet for product brands and product colour finished which I would like to both have the searchbox displayed. However, when I enable the Searchable list of checkboxes widget on both, the first one works correctly and the second one doesn't search for anything even though it doesn't display any kind of JS error in the console. Similarly, when I remove the searched string from the colour finish facet, it seems to also do some kind of search in the other facets with this widget because they all show "no results".

Proposed resolution

Each widget should only search in the facet list for which it has been selected.

🐛 Bug report
Status

Fixed

Version

2.0

Component

User interface

Created by

🇸🇰Slovakia robo.balasko

Live updates comments and jobs are added and updated live.
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.

  • 🇺🇸United States mlncn Minneapolis, MN, USA

    Guess patches go into the 3.x branch first? Either way— this was needed to fix Searchable lists even without a second one being enabled, for me.

  • Status changed to Needs review 23 days ago
  • 🇦🇹Austria drunken monkey Vienna, Austria

    The above patches didn’t work for me. Attached is my attempt, which works well for me and also makes the code much saner to look at. For instance, it avoids using $facetsWidgetSearchbox inside the event handler, which I suspect as the main problem. Also it avoids usingthe jQuery.next() function, which seems to me to be an unacceptable level of reliance on the HTML structure.
    Unfortunately, I think it won’t be possible without at least some reliance on the HTML structure – in my patch, I relied on the fact that the <input> field is a direct child of the wrapper that contains all the relevant elements for the facet. Templates where this is not the case would still break the functionality. (But they would have been broken without this patch, too, as far as I can see, so it’s at least not a regression.)

    Relying on some ancestor element with a certain CSS class being the wrapper for the facet would probably be preferrable, but not sure if we can rely on that, either. Anyways, would be trivial to adept the patch accordingly, if you think that would make more sense: just use $context = $input.closest('.wrapper-class') instead of $context = $input.parent();.

    Anyways, everyone please give the attached patch a try, especially if the previous ones didn’t work for you.

    @mlncn: If multiple people have tested the patch for 2.x already and it’s marked RTBC, then I don’t think switching the version makes much sense. I’ll let the maintainers decide on this.

  • 🇮🇱Israel Amir Simantov

    Thank you, Thomas!
    The patch that you supplied in #12 works for me (using the currently released version 2.0.7).

    Considering there haven't been any new releases in the past three months, including this patch in the upcoming release could be a valuable opportunity.

    Thanks, maintainers!

    • borisson_ committed 548e9019 on 3.0.x
      Issue #3300204 by Knurg, ronchica, drunken monkey, robo.balasko: Facets...
    • borisson_ committed ac3a42c8 on 2.0.x
      Issue #3300204 by Knurg, ronchica, drunken monkey, robo.balasko: Facets...
  • Status changed to Fixed 10 days ago
  • 🇧🇪Belgium borisson_ Mechelen, 🇧🇪

    Committed to both 2.x and 3.x

Production build 0.69.0 2024