Multiselect
Multiselect is a JQuery based plugin to provide an intuitive user interface for using select inputs with the multiple attribute present. Instead of a regular select, the library displays the button with dropdown menu containing the single options as checkboxes. Although the same feature can be achieved with regular dropdown menu and a list of checkboxes, this library provides extensive list of additional options that dropdown menu doesn't have. Explore the examples below.
Basic examples
Input group
Sizing
Advanced examples
Use "Select" and "Deselect" buttons to select or
deselect cheese and tomatoes. Display selected or
deselected options by using
$('.multiselect').val() method.
Use the button to toggle the selection. Don't forget to
include
$.uniform.update(); to update
checkboxes or radios state dynamically.
Record the order the options are selected. When
selecting an item an ordering number will be incremented
and saved within the option.
Simulate single selections using checkboxes. The
behavior will be similar to a multiselect with radio
buttons.
Select a maximum of 3 options. Then all other options
are disabled.
Using a reset button together with a multiselect. Select
options then click Reset button to reset selections.
The templates can be overriden using the
templates configuration option. The example
below uses a red border color for dividers.
Events
Methods
This method is used to destroy the plugin on the given
element - meaning unbinding the plugin.
This method is used to refresh the checked checkboxes
based on the currently selected options within the
select. Click 'Select', then click
refresh. The plugin will update the
checkboxes.
Rebuilds the whole dropdown menu. All selected options
will remain selected (if still existent!). Click
Add button and then click
Rebuild button, open dropdown and
you'll notice new options added to the bottom of the
list.
Selects an option by its value (which has to be given as
string). Works also using an array of values.
Deselect an option by its value (which has to be given
as string). Works also using an array of values.
Disable both the underlying select and the dropdown
button.
Enable both the underlying select and the dropdown
button.