Usage

Requirements

• jQuery 1.8+
• jQuery UI 1.11 widget factory and effects (if you'd like to use them)
• A jQuery UI theme
• This widget: jquery.multiselect.js
• The CSS file: jquery.multiselect.css

Optional

• jQuery UI position()
• jQuery UI resizable()

The Basics

Construct a standard select element. Adding multiple will create a multiple select widget while omitting it will create a single select widget.

<select id="example" name="example" multiple="multiple">
<option value="1">Option 1</option>
<option value="2">Option 2</option>
<option value="3">Option 3</option>
<option value="4">Option 4</option>
<option value="5">Option 5</option>
</select>

Once the document is ready, initialize the widget on the select box:

$(document).ready(function(){
   $("#example").multiselect();
});

Filter Plugin

A filtering widget is available which, once initialized on a multiselect instance, will insert a text box inside the widget header. Typing in the input will filter rows and return matches in real time. The demos folder contains an example of its usage.

$("select").multiselect().multiselectfilter();