Is it possible to create this design? (custom results and selected items rendering)

How Do I...
#1

Hello,

I’d like some guidance if the following mockup can be simulated easily using Select2, (along with some custom work ofc):

2018-12-12_01-21-48

Any hints are more than welcome! Thanks

#2

Hi, lephleg,

I don’t think it is possible to implement this design with Select2, unless you are willing to write custom Dropdown, Selection and Results Adapters. This design is simply too different from how Select2 operates.

Unfortunately there is not much good documentation about writing custom Adapters. I think you would be better off writing your own code to implement this UI. There are UI frameworks that provide easy-to-use custom components such as scrolling panels, which would help you implement this design quickly.

#3

Hello @John30013,

Thanks for the reply.

You are right, after spending some time looking custom ways to render my results and the rest of the areas required using Select2, I decided to give it up and start from scratch. Hopefully I was able to reach a fair prototype version of it within a couple of hours.

Thanks again.