jQuery Plugin For Multi Select List with Checkboxes - MultiSelect

jQuery Plugin For Multi Select List with Checkboxes - MultiSelect
File Size: 11.9 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

MultiSelect is a jQuery plugin that transforms normal multi select list into a multi-column dropdown list with checkboxes.

How to use it:

1. Include jQuery library and the jQuery multiselect plugin's files in the html page.

<script src="jquery.min.js"></script>
<script src="jquery.multiselect.js"></script>

2. Call the plugin on the multiple select element.

$('select[multiple]').multiselect({
    /* OPTIONS */
});

3. Available options.

$('select[multiple]').multiselect({

// text to use in dummy input
placeholder   : '',    

// how many columns should be use to show options
columns       : 1,  

// include option search box   
search        : false,    

// search filter options
searchOptions : {
  default      : 'Search', // search input placeholder text
  showOptGroups: false     // show option group titles if no options remaining
},     

// add select all option
selectAll     : false, 

// select entire optgroup   
selectGroup   : false,  

// minimum height of option overlay
minHeight     : 200,   

// maximum height of option overlay
maxHeight     : null,  

// display the checkbox to the user
showCheckbox  : true,  

// options for jquery.actual
jqActualOpts  : {},    

// maximum width of option overlay (or selector)
maxWidth      : null, 

// minimum number of items that can be selected
minSelect     : false, 

// maximum number of items that can be selected
maxSelect     : false, 

});

Change log:

2016-03-11

  • bugfix.

2016-01-15

  • bugfix.

2015-12-11

  • bugfix.

2015-11-20

  • New search & select all options, default placeholder text

2015-11-19

2015-06-12

  • bugfix

2015-06-11

  • touch device scroll bugfix

2015-06-10

  • browser bug fixes (mainly safari)

This awesome jQuery plugin is developed by nobleclem. For more Advanced Usages, please check the demo page or visit the official website.