jQuery Plugin For Multi Select List with Checkboxes - MultiSelect

jQuery Plugin For Multi Select List with Checkboxes - MultiSelect
File Size: 14.4 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.

Installation:

# NPM
$ npm install jQuery-MultiSelect --save

# Bower
$ bower install jQuery-MultiSelect

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:

2017-10-14

  • v2.4.3: exclude disabled options from (un)select all

2017-09-08

  • v2.4.2: updated documentation

2017-08-05

  • v2.4.1: Fix issue with maxWidth option.

2017-07-22

  • v2.4: Fix issue with searching and (un)select all functionality not working

2017-06-17

  • v2.3.13: Fix disable method issue, bugfix with hasClass() call

2017-06-03

  • performance optimization

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

  • JS update
  • bugfix

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.