JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://cdnjs.cloudflare.com/ajax/libs/chosen/1.0/chosen.jquery.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/chosen/1.0/chosen.css">
<input type="text" value="" style="width:100%">
<br>
<select id="select">
<option value="1">abc</option>
<option value="2">def</option>
<option value="3">ghi</option>
</select>
<br>
<button>Press this button to open</button>
CSS
body {
margin: 10px;
}
select {
width: 200px;
}
JavaScript
$(document).ready(function() {
$('#select').chosen();
$('button').on("click", function(evt){
evt.stopPropagation();
$('#select').trigger('chosen:open');
});
$('#select').live('change', function () {
console.log("testing");
});
});