MultiSelect Dropdown filtering

Hello there,

I’m having an issue with filtering a list of products based on multiple criteria with multiselect dropdown and especially on brand, color, material selection . :neutral_face:

For example with the brands :

  • A collection of “Brands” with a relationship with products on many to one.
  • A second collection called “Selected brands” related in many to many to users.

When filtering, I update the “Selected brands” of logged in user with :

  • add a selected brand “Every time any item is selected” and
  • remove it “Every time any item is deselected”

Then the click on the button at the bottom of filter page leads to an other page with filtered results.

When I want to filter results I tried to set :
Products > Brand > Name “contains” Logged in user> Selected Brands>Name

except the magic text selection doesn’t let me to choose Selected Brands > Name but gets only to Selected Brands>Brands ou Selected Brands > User etc…

In other components, there is neither Multiselectropdown as an option.

This way, I can’t filter the results list…

I’m kind of worried because user on the app should manage to select multiple brands to find products he’s been looking for.
Has anyone managed to filter a list of products with multiselect dropdown ?

Thanks a lot for your help

Hi @chrl :wave:

Like how you want to filter the dropdown?

And I think you don’t need a collection for the Selected brands. You can create a relationship property between Users collection Many to Many and Update that property ( Item selected Update logged in user > Brands add current brand and Oposite one for the remove one ) and filter the list as Logged in user> Brands

Thank you

I’ve just tried but it seems it doesn’t work either
(Brand collection is called Marque collection in the app)

Any idea ?

Thanks again

No need to add Custom filters. Set the collection to the brands collection and set the filter from All brands to Logged in user > Brands

Thanks, it works great but I when I want to add a filter the same way such as “color” in MultiSelect Dropdown, there is still the problem to filter results. Here is the screenshot.

Thanks

Is there a collection for colours as Brands?

Yes and more such as Product condition, Materials and Style.

I would like to be able to filter with brands, colors, condition, materials and style in the same list

Ok so you are trying to filter the product list from User’s selection?

Yes, indeed

So you have added a multi select drop-down to select the brand?

Yes and some more to choose color, condition, material and style.
For instance, it’s working with brands but other filters related to Multiselect Dropdown don’t.

Hi @chrl,

I assume that you have a many-to-many relationship between Brands <-> Users, Colors <-> Users to store the “selected options”?

In this case, here is the way you can make your list filtering work:

Basically, from a product you have a relationship to Color and Brand and etc. The collection records in Color (for example) will have a relationship to Users collection; if user selects a color, you create a “link” in Multiselect dropdown between User and Color. So you can then use this relationship to select "All’ users (see screenshot) and filter them out by Logged-in User.

However, there are two huge drawbacks to such approach in general:

  • multiselect dropdown can’t “prepopulate” the selections. So when your user will open the filter for the 2nd time, the dropdown selections will be empty, however, the relationships will be there. So you need to invent how to clear them.
  • many-to-many relationships are not very fast in Adalo. They could be used in some cases, but in this scenario with the user base growth the speed will decrease.

I’d advise to think about some alternative way of filtering.

Best regards, Victor.

1 Like

Thanks a lot for your reply, unfortunately as soon as I set a second filter, I get no results. So I don’t know how to proceed to get this multi factor filter and it’s really annoying.

The way to clear that choice up is a real problem indeed. Haven’t found a way to do it yet.

Hi @chrl,

Then most probably it is either something wrong with the relationships or in the dropdown actions.
I’ve made screenshots from the sample I’ve created - both filter work.
Though I really don’t like multiselect dropdown in this case - I don’t think it will work properly in real app.
It might be a good idea to think how to create a filter for multiple properties in the most efficient way :thinking:

Best regards, Victor.

I’ve encountered today some troubles with the lists. It seems to work again, hope it will go on…

You mean a select menu ? It would at least enables to clear the selection but the app has to let user select different brands, colors…

Would you have any idea of the way to clear the selection ? As the MultiSelected Dropdown is not recognized as a component, I didn’t manage to clear user choices.

Thanks again

Ok, how many brands, colors, product condition, material and styles are we talking about?
Just an evaluation - because some solution will work for 2…5 selections, others for 5…10, etc.

Clearing the selection is possible either via countdown timer or an external script. With a countdown, you will need to have a screen where you have lists of Brands, Colors, Materials, etc., filtered by Selectedby contains Logged-in User. And then you put countdown into the list, to remove this relationship. See the video with the same principle here. Adalo experiments: mass update via integromat photos and categories - YouTube

Cordialement,
Victor.

I would say 2-5 selections for each item (Brands, Colors, Materials…).
So you need to create another collected of items selected filtered by Selected by contains Logged in user ? How do you remove the relationship with the timer ?
I’d rather like not to go through external script

I’ve already checked this solution, it’s really interesting but not useful when you want an user selecting several colors or conditions at a time…

Hi @Victor
This problem got my attention, but I could not figure out the last step.
I found an excellent alternative to avoid the multi-select dropdown component because it does not function accurately.

Maybe you could finish it and finally solve @chrl problem