select2

by toubia95

HTML

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/select2.min.css">
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/select2.min.js"></script>
<select class="js-example-basic-single" name="state[]"  multiple="multiple">
  <option value="AL">Alabama</option>
  <option value="WY">Wyoming</option>
</select>

CSS

/* https://select2.org/tagging */
select {
  width: 100%;
}

JavaScript

// In your Javascript (external .js resource or <script> tag)
$(document).ready(function() {
    $('.js-example-basic-single').select2({
    	placeholder: 'Select an option',
      tags: true,
      tokenSeparators: [',', ' '],
      maximumSelectionLength: 3
    });
});