Select2 Sortable

select2-Sortable is an extension to convert select2 multiple select to Sortable using Drag & drop (https://select2.org)

Requirements

Make sure you use jQuery UI in your project/website to use this extension.

if you're using Wordpress then you can use this default wordpress option on your website before enqueuing select2-sortable.js file.

wp_enqueue_script( 'jquery-ui' );

• Select2 >= 4.0

Usage

You just need to call a simple function/method "select2Sortable()" instead of calling "select2()" method.

!(function ($) {
	var $select = $(document).find('.select2-wrap').select2Sortable();
})(jQuery);

You also need to use a data attribute in your <select> tag, which is data-initials="". In this attribute you'll pass the field value into string form using (,) Comma. if you're getting array then convert it to string with (,) then pass it like this:

<select name="countries" class="select2-wrap" multiple data-initials="UK,IN">
	<option value="US" selected>United State</option>
	<option value="IN" selected>India</option>
	<option value="UK" selected>United Kindom</option>
</select>

We're using "data-initials" to know the order of last saved values and when the select2 will initialize and values will be selected we'll sort them again on init.

Contributing

Contributions are welcome from everyone. We have contributing guidelines to help you get started.

References Taken From

• Github Issue Page
• select2Sortable