JSFiddle - React, Tailwind, and code Playground
by nothrem
HTML
<link href="//cdnjs.cloudflare.com/ajax/libs/slim-select/2.4.1/slimselect.min.css" rel="stylesheet">
<script src="//cdnjs.cloudflare.com/ajax/libs/slim-select/2.4.1/slimselect.min.js"></script>
<label for=demo>Try selecting something:</label>
<select id=close_demo name=demo>
<option value data-placeholder=true></option>
<option value=1>Item 1</option>
<option value=2>Item 2</option>
<option value=3>Item 3</option>
</select>
<span></span>
JavaScript
jQuery(function($) {
let ss = new SlimSelect({
select: '#close_demo',
settings: {
placeholderText: '' //no placeholder
},
events: {
beforeChange: function() {
alert('Sorry, you cannot use this.');
ss.disable();
$('span').click();
return false;
}
}
});
});