JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.js"></script>
<select id="test">
</select>
JavaScript
$('#test').select2({
placeholder: 'Select an option',
minimumInputLength: 1,
width: '100%',
tags: true,
allowClear: true,
ajax:{
url: '/echo/json/',
dataType: "json",
processResults: function (data, page) {
var results = [
{id: 1, text: "Option 1"},
{id: 2, text: "Option 2"},
{id: 3, text: "Option 3"},
];
return {results: results};
}
}
});
$('#test').change(function(){
alert('option changed');
});