Choices.JS v7.0.0

We have styled the select picker to look similar to the dropdown and the other inputs. To see the original documentation, please check out ChoicesJS repo on GitHub.

Single Selection

<select class="form-control" data-trigger name="choices-single-default" id="choices-single-default">
  <option disabled selected>Single Option</option>
  <option value="2">Foobar</option>
  <option value="3">Is great</option>
  <option value="4">Pick one</option>
</select>

Multiple selection

<select class="form-control" data-trigger name="choices-multiple-default" id="choices-multiple-default" multiple >
  <option disabled> Multiple Options</option>
  <option value="2">Paris </option>
  <option value="3">Bucharest</option>
  <option value="4">Rome</option>
  <option value="5">New York</option>
  <option value="6">Miami </option>
  <option value="7">Los Santos</option>
  <option value="8">Sydney</option>
  <option value="9">Piatra Neamt</option>
</select>

Tags Input

<input id="badges" type="text" value="Amsterdam,Sydney, Rome, Singapore" placeholder="+ Add">
   <!-- Activate Choices -->
  new Choices('#choices-single-default', {
        search: false,
      });

  new Choices('#choices-multiple-default', {
        search: true,
        delimiter: ',',
        editItems: true,
        removeItemButton: true,
      });