Select2
Selec2 with bootstrap support
Markup
<select id="multiple" class="form-control select2-multiple" multiple> <optgroup label="Alaskan/Hawaiian Time Zone"> <option value="AK">Alaska</option> <option value="HI">Hawaii</option> </optgroup> ... </select>
JS
/** * select2.js * select2-bootstrap.css * */ if ($.fn.select2) { var placeholder = "Select a State"; $('.select2, .select2-multiple').select2({ placeholder: placeholder }); $('.select2-allow-clear').select2({ allowClear: true, placeholder: placeholder }); $('button[data-select2-open]').click(function () { $('#' + $(this).data('select2-open')).select2('open'); }); var select2OpenEventName = "select2-open"; $(':checkbox').on("click", function () { $(this).parent().nextAll('select').select2("enable", this.checked); }); }