JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<select id="aaaa" style="width: 80%;" class="js-example-basic-multiple" name="states[]" multiple="multiple">
</select>
<button >הדפס ערכים</button>
CSS
.select2-dropdown--below{
display: none;
}
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
JavaScript
$('.js-example-basic-multiple').select2({tags: true,
tokenSeparators: [',', ' ']});
$('button').click(function() {
var allKeys = Object.keys(aaaa);
var txt = '';
for(var key of allKeys) {
txt += key + ': ' + aaaa[key].value + ','
}
console.log(txt) //לא ידעתי איך אני מדפיס למסך אז שלחתי לקונסולה ושם רואים את זה שגם כשהוא ריק הוא מדפיס נתונים
})