Select2 is a jQuery-based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
Select2 is a jQuery based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
Stack Snippet Starter Pack
HTML
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/css/select2.min.css" rel="stylesheet" />
<script src="//code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.4/js/select2.min.js"></script>
<select class="select2">
  <option value="AL">Alabama</option>
  <option value="AK">Alaska</option>
  <option value="AZ">Arizona</option>
</select>
JavaScript
$('.select2').select2();
// get data when an option is selected
$('.select2').on('select2:select', function (e) {
    var data = e.params.data;
    console.log(data.id, data.text);
    // other data, eg get data-more:  
    $(data.element).data("more")
});
// language example changing no results
$('.select2').select2({ 
    language: { 
        noResults: function () { return "try again"; } 
    }
});
 
     
     
     
     
     
     
     
     
     
     
     
     
     
    