javascript select2 sortable

Solutions on MaxInterview for javascript select2 sortable by the best coders in the world

showing results for - "javascript select2 sortable"
Marco
08 Oct 2020
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});