1//CSS Must Include CSS
2.sortable {
3 list-style-type: none;
4
5}
6
7.select2-selection__rendered li.placeholder {
8 width: 0;
9 height: 0;
10 border-bottom: 5px solid transparent !important;
11 border-top: 5px solid green !important;
12 border-left: 5px solid transparent !important;
13 border-right: 5px solid transparent !important;
14 max-width: 100%;
15 overflow: hidden;
16 /*Altered two below to make word wrap work */
17 word-wrap: normal !important;
18 white-space: normal;
19 float: left;
20}
21
22$("#selectid").select2(opt);
23("#selectid").parent().find(".select2-selection__rendered").sortable({
24 containment: 'parent',
25 onDrop: function ($item, container, _super) {
26 var $clonedItem = $('<li/>').css({ height: 0 });
27 $item.before($clonedItem);
28 $clonedItem.animate({ 'height': $item.height() });
29 $item.animate($clonedItem.position(), function () {
30 $clonedItem.detach();
31 _super($item, container);
32 });
33
34 $($("#selectid").parent().find("ul").find('.select2-selection__choice').get().reverse()).each(function () {
35 var id = $(this).data('data').id;
36 var option = $(this_val).find('option[value="' + id + '"]')[0];
37 $("#selectid").prepend(option);
38 });
39
40 $("#selectid").trigger("change");
41 }
42});