Reorder options inside select
by RoryMcCrossan
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.full.min.js"></script>
<select name="list" id="mylist" multiple style="width:140px;">
</select>
JavaScript
var dataUser = [{
"id": "5",
"text": "BTest"
}, {
"id": "2",
"text": "ATest"
}, {
"id": "8",
"text": "CTest"
}, {
"id": "13",
"text": "DTest"
}];
$("#mylist").select2({
data: dataUser,
templateResult: function(data) {
return data.text;
},
sorter: function(data) {
return data.sort(function(a, b) {
return a.text < b.text ? -1 : a.text > b.text ? 1 : 0;
});
}
}).on("select2:select", function (e) {
$('.select2-selection__rendered li.select2-selection__choice').sort(function(a, b) {
return $(a).text() < $(b).text() ? -1 : $(a).text() > $(b).text() ? 1 : 0;
}).prependTo('.select2-selection__rendered');
});