How to build an email "To" alike multiple selection field

Questions / Help
,
1

Hi community,

I would like to build a multiple selection field which has a suggestion shown on typing. I don’t have any luck in googling similar library / solutions online.

image
image1204×284 36.5 KB

I am here to ask for help on how to build this.

Thank you in advance!

Best regards,
Jing Hui PANG

2

It depends on what you using. Are you using LiveView or is it just a plain view?
There isn’t much UI libraries for LiveView yet for what you are looking (if you are using LV that is), you would probably need to roll your own.

You would want to build something like this (MultiSelect | Mantine REACT). You would make use of a Hook to help you build it, although the JS module exists it isn’t enough on its own to accomplish more complex behavior of such component, in my opinion (I have built a multiselect component for a private app).

You could maybe take some ideas from this: LiveSelect - Dynamic selection input component for LiveView or maybe it’s even enough for what you want. :slight_smile:
There is also this: GitHub - saleyn/phx-multi-select: Phoenix LiveView MultiSelect Component

1 Like