How to create a filtered drop-down menu inside a formular?

Hello,

I want to create a form, by which a user can create a new Product.

There are already existing products in the common database, and I would like the user to access them through a drop-down menu, to avoid entering a reference that could already exists.

Also, the Products are linked to a “Manufacturer” and a “Category” (each Product can have only 1 Manufacturer and 1 Category ; each Manufacturer or Category can have multiple Products).

So here is the user experience I am looking for:

  1. User select a Manufacturer and a Category through a drop-down menu:

  1. User select a Product in a drop-down menu:

For now, I don’t find how to create a drop-down menu, instead of this text field.

In a better world, I would like the User to select a Product in a drop-down menu, on the second screen. And I would like all product shown in the drop-down menu to be filtered by the Manufacturer and Category he selected on the first screen.

Then, if the user don’t find the product he wants to add in the drop-down menu, he can add a new product through another way, by typing the text, and that product will be available in this drop-down menu for any future user (if the future user filters the same Manufacturer and Category with which the Product have been created).

Does anyone have proposals on how to do it?

To clarify : a Product can have multiple Users, and a User can have multiple Products.

If someone have the solution, I will celebrate this person!

Hi @legrec,

Welcome to the community :partying_face:

You can achieve this with custom forms and you cannot achieve this with the form component, unfortunately!
If products available for the selected Manufacturer and Category has to show them on the drop-down and does it needs to create a record once the button clicked?

Am I correct? : Create Products

Thank you

Hi @dilon_perera ,

Thank you for your kindness :slight_smile:

Yes you are correct : if Products are available for the selected Manufacturer and Category, they have to be shown on the drop-down, and I would like the selected product to be recorded once the button clicked.

Thank you for your little demo.

The only way I found until now for a product to be created once selected, is through a click-action on a list which I have set up like that:

But I encounter another problem: I would like each name to be shown only once. Is there a possibility to that?

For instance, a Product exists for such Manufacturer and Category:

First screen

Second screen
image

But next time a user will do it, it will see the original record + all the records that other users also added for this product:

Then

Etc…

Hi again,

Does anyone have a solution for a drop-down menu to avoid duplicates outputs ? (problem explained above)

Hi @legrec,

Sorry for the late reply!

Am I correct? : Create Products

Thank you

1 Like

Hey @dilon_perera, it seems yess, you’re correct!!

How did you do that?

1 Like

Awesome!

You can clone the app and check! If you want a video I’ll share a one tomorrow!

Hello @dilon_perera ,

I thank you very very much because:

  1. You solved my problem

  2. Cloning you app allowed me to quickly learn:
    how to group components (dropdowns + buttons) to create more custom “forms”
    how to avoid duplicated items in a list, with your smart introduction of an “original” boolean as a property in a collection (which was my main problem)
    how to link a selection to another screen output, without the need to create a data in the base for now, by appealing it from “Other Components” → “All Screens” → “Screen containing the selected option”

I really found your resource very very helpfull!

Thanks a lot :slight_smile:

1 Like