I am trying to: have multiple filter inputs for a e-commerce storefront.
Link to a page where the issue can be seen: lien caché
I expected to be able to select multiple filter inputs before selecting "Submit" to have the view results update, however selecting even just a single filter input reloads the filter area. If I select multiple inputs at a time, the ones I selected after the first one get removed, and then get added in again.
This gets especially problematic on mobile where I have the filters in a container that needs a jQuery trigger event to open up. The filter area gets reloaded, and closes up the container, forcing the user to select the sandwich icon to open up the filters again.
You can view a demonstration of the problem here: lien caché
This is a huge UX issue, even on desktop, where having user inputs disappear, then appear again makes for confusing operation. I've experienced this on multiple sites where we use checkboxes to allow users to select multiple filters at a time.
This occurs when the "Custom Search Settings" are set to either of the following:
Full page refresh when visitors click on the search button
or
Let me choose individual settings manually
Update the View results only when clicking on the search button
Reload the page to update the View results
Show only available options for each input (all input types are set to Hide)
Oddly, it doesn't do it when the "Always show all values for inputs" option is selected, but this gives me undesired results, as I'm not using all the product categories at this time.
Any help in the matter would be greatly appreciated.
This is exactly why you are getting the values refreshed, because you don't have that option enabled. What happens is that your filters are always re-adjusting to ensure that your view will always return a result.
So if a filter is selected it will do a short query to check if the other filters will return a result while your first filter is selected. If the filter doesn't return a result it will be hidden or disabled based on your settings.
This still doesn't address the wonky UX. If it has to refresh itself every time a user selects an input, the operation then flies in contradiction to the statement "Update the View results only when clicking the search button", especially with the "Reload the page to update View results" option selected.
Regardless of the wording used, it's confusing operation if a user selects multiple filter inputs at a time, then those selected inputs disappear and reappear again. The recalculating should only have to happen if the user selects the submit button. No other values should change until that occurs.
This is not necessarily contradicting as the option "Update the View results " is different as this only affects the results.
The filters operate independently of this as the filter A, Filter B and Filter C will be dependent on each other.
So if the user selects an option From Filter A then the items from filter B and C will then re-adjust so that If you select an option in Filter B or C it will always return a result based on the option of Filter A.
This is all done even before the user clicks on the search button. If it wasn't done like then this then the user will be able to search the view and it can result in selection options that will return no results for the form.
This refresh is more obvious because of the usage of checkboxes. Normally you will see the checkboxes that won't return a result disappear given what you've chosen on the other filters as they are data dependent.
Please let me know if I have clarified this issue for you.
Then why have checkboxes if the filters are going to operate like this anyway? I understood your original explanation, however as I stated in my response, it does not address the wonky user experience.
Toolset has these settings that support checkboxes as filter inputs, implying that it's expected that a user will select multiple inputs in tandem, and other settings that state that the results won't update until the user selects the Submit button. Then it was decided that it was acceptable behavior to have the filter area reset every time a user selects a single filter input. This operation is not instantaneous. You can literally see the selected inputs disappear, with at least a one second delay, then reappear slowly after that.
I get that it was developed like this, but I'm saying that I'm not satisfied with this existing operation. Is there a workaround that I can use besides configuring the setting to "Always show all values for inputs"? The reason I don't want this setting is that I have product categories, that have no products, which should not be visible in the filter area. The clients have the intention of eventually using these categories, but until then I need them hidden. I'm not going to resort to CSS to artificially remove them from the flow, when I shouldn't have to, especially when the client could add products at any time.
However when I took a look at this locally and disabled all the non-toolset plugins the page worked fine and the filters weren't disappearing and reappearing selected.
Could you temporarily disable the non-toolset plugins on your end and try this to let me know what the result is for you ?
However I have gotten a response from our 2nd tier supporters and it is as I suspected. This is because of the dependency on the filters.
SO each filter is dependent on what is previously selected and if the user selects quite a number of filters in quick succession then you will get this deselecting and reselecting.
This is because the filters are data dependent on each other so once you select the first filter then a short query is ran to ensure that the other filters will produce a result. This is why you see the items being deselected.
I know that this could use some improvement but as they say it is an expected behaviour of the filters when you are using the setting to hide filters that won't produce any results.