Select Multiple Options In A Select With Checkboxes - i9multiselect
File Size: | 7.36 KB |
---|---|
Views Total: | 2319 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
i9multiselect is a dead simple jQuery multi select plugin that allows the user to select multiple options in a select element with checkboxes.
Works with the native select multiple
attribute. It enables you to select multiple options by clicking without the need of holding down the Ctrl (Windows) or Command (Mac) button.
How to use it:
1. Load the latest Font Awesome iconic font for check/uncheck icons.
<link rel="stylesheet" href="/path/to/fontawesome/all.css" />
2. Load jQuery library and the jQuery i9multiselect plugin in the document.
<link rel="stylesheet" href="/path/to/i9multiselect.css" /> <script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/i9multiselect.js"></script>
3. Add the i9multiselect
class and multiple
attribute to the select
element:
<select id="select" class="i9multiselect" multiple required> <option value="1">Value 1</option> <option value="2">Value 2</option> <option value="3">Value 3</option> <option value="4">Value 4</option> <option value="5">Value 5</option> <option value="6">Value 6</option> <option value="7">Value 7</option> <option value="8">Value 8</option> <option value="9">Value 9</option> <option value="10">Value 10</option> </select>
4. Initialize the plugin on the select
element and you're done.
$(function(){ $('select').i9multiselect(); });
This awesome jQuery plugin is developed by mmi9. For more Advanced Usages, please check the demo page or visit the official website.