Sortable Dual List Box In jQuery - multiselect.sortable.js

Sortable Dual List Box In jQuery - multiselect.sortable.js
File Size: 4.95 KB
Views Total: 1068
Last Update:
Publish Date:
Official Website: Go to website
License: MIT

A jQuery multiple select plugin that turns a normal select element into a sortable dual list box, where you can swap options between two side-by-side selection lists.

See Also:

How to use it:

1. Load the needed jQuery library and jQuery UI (for sortable function) in the document.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/cdn/jquery-ui.min.js"></script>

2. Load the multiselect-sortable plugin's files.

<script src="assets/js/jquery.multiselect.sortable.js"></script>
<link rel="stylesheet" href="assets/css/jquery.multiselect.sortable.js.css" />

3. Add the multiselectsortable class to your multiple select and define the pre-selected options using the selected attribute:

<select name="multiselectsortable" class="multiselectsortable" multiple>
  <option value="1" selected disabled>jQuery</option>
  <option value="2" selected disabled>Script</option>
  <option value="3" disabled></option>
  <option value="4" selected></option>
  <option value="5" selected></option>
  <option value="6" selected></option>
  <option value="7" selected></option>

4. Call the function on the select element and the plugin will do the rest.


5. Customize the titles of the dual list box.

    selection :{

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