Ideal Select
Small select dropdown replacement.
Support: IE9+ and modern browsers
Demo: http://jsbin.com/uMahupU/3
How To
Load:
<script src="js/jquery.idealselect.min.js"></script> <link rel="stylesheet" href="css/jquery.idealselect.css">
Create select
:
<select id="states" name="states"> <option value="AL">Alabama</option> ... </select>
Initialize:
// Only single select supported $('select:not([multiple])').idealselect();
Events
Just trigger events on the original select element:
$('#states').change(function() { console.log('triggered!'); });
Dynamic
If you add more elements to your select make sure to build the markup again:
var options = [ '<option value="one">One</option>', '<option value="two">Two</option>', '<option value="three">Three</option>' ]; $('#states').append(options.join('')).idealselect('_build');