The Multiselect plugin replaces native select elements with a modal containing checkboxes or radio buttons.

By default, just add the class multiselect and it will do its magic. You can turn any select into a multiselct using javascript: $("#mySelect").multiselect(options);

View on GitHub

Install (bower)

You can install as a bower package:

bower install bootstrap-modalselect

Heads Up! The bower package name of the package is bootstrap-modalselect because bootstrap-multiselect was taken.

Single Select

Multi Select

Optgoup Select

Options

The Multiselect plugin allows you to configure options via data attributes or directly via javascript

Example:
<select class="form-control multiselect" data-list="3" data-target="#exampleTarget" multiple>
Name type default description
list int 1 The number items that are listed in the multiselect
target string body The target for the location of the generated modal. By default, the modal is appended the the body tag.

Methods

.multiselect(options)

Activates your select(s) as a multiselect. Accepts an optional options object.

        
            $('select').multiselect();
        
    

.multiselect('widget')

Returns the dom node that is the viewable multiselect element

        
            var $widget = $('select').multiselect('widget');
            //do stuff with the $widget
        
    

.multiselect('modal')

Returns the dom node that is the bs modal for the multiselect. Please see the bs documentation for its usage.

        
            var $modal = $('select').multiselect('modal');
            //do stuff with the $modal