Accessible Multiselect Dropdown

Follow me!

If you like this article, go ahead and follow me on Twitter:

Follow @getButterfly

Sometimes you need to turn a multiple dropdown into a multiple checkbox selector. No other bells and whistles, no search, no custom functionality, no JavaScript dependencies. I’m working on one, currently 300 lines of JavaScript, gracefully degrading to a <select multiple>.

Note #1: This is beta, and some things might change!

Note #2: This will eventually be part of Thin UI.

Future Improvements

  • Better looking dropdown button
  • Absolutely positioned dropdown popup
  • Complete documentation and demo page

I have tried lots of solutions out there and I’ve even settled for tail.select for some projects. They are too glitchy sometimes and have way more features than I’ll ever need. The basic requirement for me is a multiple <select> dropdown element with checkboxes and search.

👋 Added by Ciprian on Monday, September 28, 2020 in Blog. Last modified on Monday, September 28, 2020.

Contribute!

Contribute to this article by sharing your opinion on Twitter:

Unlimited Automated Page Speed Monitoring & Tracking.
Use SpeedFactor to track your website. It’s simple and reliable.
See how real people experience the speed of your website. Then find (and fix) your web performance problems.
Get Started
Privacy Policy