16 jQuery SelectBox/Drop-down Plugins

Sam Deering

Web developers and designers always need SelectBox and Drop-down menus when building their site, so I’ve compiled a list of 16 of the best jQuery Selectbox/Drop-down Plugins.

Update 12/12/2013: Added 16. Selectric.
Update 25/05/2013: Added 14. bootstrap-select & 15. jQuery selectBox.
Update 25/07/2012: Added 13. Multiple Select Box Plugin.
Update 15/07/2012: Added 12. ddSlick.
Update 05/04/2012: Added 11. Chosen.

Related Posts:

1. McDropDown

If you needed to develop a unique UI control that would allow users to select from a complex hierarchical tree of options, then this plugin is for you.


McDropDown

Source + Demo

2. LinkSelect

While there are many similar plugins, the key differentiator with the LinkSelect plugin is that is designed to fit in limited real estate.


LinkSelect

Source + Demo

3. Image Combo Box

If you tired with your old fashion selectbox try this one. Image combo box. You can add an icon with each option. It works with your existing “select” element.


Image Combo Box

Source Demo

4. jQuery Chained Select

To chain combobox state to combobox country and combobox city to combobox state you must write the following code.


jQuery Chained Select

Source Demo

5. QuickSelect

The QuickSelect plugin allows you to create a text input with a list of specified options, and as you type, those options show up in a list below the input box. You can choose to have it top result into the input box as you type, or select an option using the arrow keys.


QuickSelect

Source + Demo

6. jQuery Selectbox Plugin

Custom select box replacement inspired by jQuery UI source.


jQuery Selectbox

Source + Demo

7. Droplist Filter

This is a JavaScript tool for adding a little search widget next to any droplist.


Droplist Filter

Source + Demo

8. jQuery Searchable DropDown Plugin

A jQuery plugin which extends normal dropdown (select) elements to be searchable.


jQuery Searchable DropDown

Source Demo

9. Search Box with Filter

This search box reveals a drop down menu after the user clicks into the input field. The menu is meant to act as a filter with several checkbox options that allow the user to select specific categories for his search.


Search Box with Filter

Source Demo

10. Sexy Combo jQuery Plugin

A jQuery plugin that allows you to turn default browser selectboxes into much more attractive and usable comboboxes.


Sexy Combo jQuery Plugin

Source + Demo

11. Chosen jQuery Plugin

Chosen is a JavaScript plugin that makes long, unwieldy select boxes much more user-friendly. It is currently available in both jQuery and Prototype flavors.

chosen-jquery-plugin
Source + Demo

12. ddSlick jQuery Plugin

Good drop down plugin, adds images and description to otherwise boring drop downs.

ddslick
Source + Demo

13. jQuery Multiple Select Box Plugin


Demo

14. bootstrap-select

A custom select for @twitter Bootstrap using button dropdown.


dropdown1

Source + Demo

15. jQuery selectBox

A styleable replacement for SELECT elements


dropdown2

Source + Demo

16. jQuery Selectric

Selectric is a jQuery plugin designed to help at stylizing and manipulating HTML selects.


selectric

Source Demo

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.

  • http://www.jeanphilippebellon.com ReBleach

    You’ve forgotten the best one : CHOSEN.JS ! “Chosen” is an amazing plugin with lot of possibilities.

    http://harvesthq.github.com/chosen/

    • http://jquery4u.com/ jQuery4u

      Chosen is there! :)

  • http://www.flashjunior.ch Fj

    Chosen is my favorite: http://harvesthq.github.com/chosen/

    • jquery4u

      @ ReBleach, Fj – Thanks for the share, I just had a look at Chosen and on first look I must say I am quite impressed with it. I’ll add it to the list now.

  • http://www.gregfranko.com Greg Franko

    I just recently released SelectBoxIt. You can optionally theme it with jQueryUI and animate it with jQueryUI show/hide effects. Take a look at it on Github: https://github.com/gfranko/jQuery.selectBoxIt.js

  • zai

    is there any facility where i can allow the user add items if necessary? plz help me

  • Abbas

    Chosen is really the chosen one. Great tool. Loved It.

  • dK

    thanks :)

  • Random Guy

    #11, Chosen should be #1 on this list. Just saying. EXACTLY what I was looking for in a filter select plugin.

    • http://jquery4u.com/ jQuery4u

      Yeah it’s a good one mate!

  • lsdjfjkshdfksdhf

    asjdgjahsdjagsdgagsdjasdasdasdfhasfdhasfdhafshdfashdfashdfahsdfahsfdhasfdhasfdhasgfdghasfdghasfdghasdfhasgdfaghsdfhdfhdfsdgfasdasdgfashdgfashdgfashdfsgfashdfahsdfahsdfahsdfhasdfhasdfashdfashdfashdfashdfashdfashfdhasdfashdfashdfashdfashdfashdfashdfashdfashdgfashdfahsdfashdfasdhgfasdhgasfdhgasfdahsgdfahsdfashdfashdgfasdgfashdgfashdgfashdgfashdgfasdgfashdgfashdgfasdgfasdghfashdfashdgfasdhasdhjasgdjasgdkashdkawyieyq836er823689r68sifyiweuryiwrywe8rasjdgjahsdjagsdgagsdjasdasdasdfhasfdhasfdhafshdfashdfashdfahsdfahsfdhasfdhasfdhasgfdghasfdghasfdghasdfhasgdfaghsdfhdfhdfsdgfasdasdgfashdgfashdgfashdfsgfashdfahsdfahsdfahsdfhasdfhasdfashdfashdfashdfashdfashdfashfdhasdfashdfashdfashdfashdfashdfashdfashdfashdgfashdfahsdfashdfasdhgfasdhgasfdhgasfdahsgdfahsdfashdfashdgfasdgfashdgfashdgfashdgfashdgfasdgfashdgfashdgfasdgfasdghfashdfashdgfasdhasdhjasgdjasgdkashdkawyieyq836er823689r68sifyiweuryiwrywe8rasjdgjahsdjagsdgagsdjasdasdasdfhasfdhasfdhafshdfashdfashdfahsdfahsfdhasfdhasfdhasgfdghasfdghasfdghasdfhasgdfaghsdfhdfhdfsdgfasdasdgfashdgfashdgfashdfsgfashdfahsdfahsdfahsdfhasdfhasdfashdfashdfashdfashdfashdfashfdhasdfashdfashdfashdfashdfashdfashdfashdfashdgfashdfahsdfashdfasdhgfasdhgasfdhgasfdahsgdfahsdfashdfashdgfasdgfashdgfashdgfashdgfashdgfasdgfashdgfashdgfasdgfasdghfashdfashdgfasdhasdhjasgdjasgdkashdkawyieyq836er823689r68sifyiweuryiwrywe8r

  • Hope

    Hey!

    Can you help me with a small problem. I want the select boxes to allow multiple choices and also have the option of chaining such that if the user selects three options in the first box, the second should be populated with options corresponding to the ones selected. So, you know I want a Jquery multi-select + cascading drop-down example. I tried using the chaining plugin and the multi-select plugin together but only one of them can work at a time.

  • kimxinfo

    good dropdownlist

  • GroovyCat

    chosen is good. but i think dropKick is pretty awesome too. http://robdel12.github.io/DropKick/