Choice.js
A vanilla, lightweight, configurable select box/text input plugin.
Requires CSS and JS. (Note: if you are using our dist folder then will get libs folder in it.)
assets/libs/choices.js/public/assets/scripts/choices.min.js
assets/js/vendors/choice.js
assets/js/vendors/choice.js
Note that this component requires the use of the third-party
Choice-js
plugin.
Text inputs
<div>
<label class="form-label" for="choices-text-remove-button">Limited to 5
values
with remove
button</label>
<input class="form-control" data-choices=""
data-choices-removeitembutton="true"
id="choices-text-remove-button"
type="text"
value="preset-1,preset-2" placeholder="Enter something" />
</div>
Select Option
<select data-choices data-choices-removeitembutton="true"
data-choices-classname="form-select"
aria-label="Default select example">
<option value="">Sort by: Featured</option>
<option value="Best
selling">Best selling</option>
<option value="Alphabetically, A-Z">Alphabetically, A-Z</option>
<option value="Alphabetically, Z-A">Alphabetically, Z-A</option>
<option value="Price, low to high">Price, low to high</option>
<option value="Price, high to low">Price, high to low</option>
<option value="Date, old to new">Date, old to new</option>
<option value="Date, new to old">Date, new to old</option>
</select>