March 11, 2015 3420 Views 0 Comment

Jquery Multi-Select and Autocomplete Plugin


The world of jQuery is filled with awesome plugins that offer quick access to tons of features every developer needs to make their web projects tick. As a follow up to a post I made over a year ago about how to create your very own autocomplete using PHP and JavaScript I would like to introduce the jQuery Chosen plugin. The plugin is hosted at and is my favourite plugin by far for making Select Boxes complete.

The plugin is able to transform standard select boxes into Multi Select dropdown boxes with Autocomplete capability.

Chosen Plugin

Easy to implement

To use the plugin Download using link above and extract to your project. Next, include the following css and jquery files into your project:

<link rel="stylesheet" href="docsupport/prism.css">
<link rel="stylesheet" href="chosen.css">

<script src="" type="text/javascript"></script>
<script src="chosen.jquery.js" type="text/javascript"></script>
<script src="docsupport/prism.js" type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">

The code above will transform your traditional select boxes with class chosen-select into new awesome select boxes with autocomplete and multiselect features. Chosen has a number of options and attributes that allow you to have full control of your select boxes. Goto to see a full list of options.