React Js Autocomplete Multi select example

Question

I'm pretty new to React Js, I have a requirement for building AutoComplete Multiselect dropdown. Despite looking around for lot of examples, I was suggested not use any third party libraries. And pretty clueless how to start and proceed further.

My requirements are

Have an input text box for typing names.
Display sugggested name with checkbox.
Upon checking the names, they must be display in an
with an 'X' symbol(remove item)
If I uncheck the name from the multiselect dropdown, it must be removed from the li.
If I Click the 'X' it should be removed from the li and uncheck the item from dropdown list.
And lastly , I need to display the selected items in the input fields like

I've been trying to implement this functionality but figure out how.

Can anyone please provide some reference and any guidance in implementing this functionality or any examples. It would be a great help.

Thanks

Grazer · Accepted Answer · 2020-07-22 15:50:17Z

2

I'm not sure why the recommendation against third party libraries. These component can get complicated fast.

I recommend you use a third party. Don't reinvent the wheel!

Something like https://github.com/JedWatson/react-select will do what you want. It has been around for years and has over 300 contributors and 2 million weekly downloads.

answered Jul 22, 2020 at 15:50

Grazer

3754 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vijay Over a year ago

I pretty much agree with you.. but it was meant not to work with react select or any other products..please help me with the requirement if possible..

wick3d Over a year ago

Did you figure this out?

Collectives™ on Stack Overflow

React Js Autocomplete Multi select example

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related