Choice JS
In this method, selecting only one option from a lots of options while only using up as much space as a single option excepted. For more details
A Basic
HTML Code
<select class="form-control" id="choices-basic">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
Script
const choicebasic = document.querySelector('#choices-basic')
if (choicebasic) {
new Choices(choicebasic, {
searchEnabled: false,
removeItemButton: true,
})
}
Multiple Choice
HTML Code
<select multiple class="form-control choices-multiple-remove-button">
<option value="Choice 1" selected>Choice 1</option>
<option value="Choice 2">Choice 2</option>
<option value="Choice 3">Choice 3</option>
<option value="Choice 4">Choice 4</option>
</select>
Script
const multipleCancelButton = document.querySelectorAll('.choices-multiple-remove-button')
if (multipleCancelButton) {
Array.from(multipleCancelButton, (elem) => {
window.choise = new Choices(elem, {
removeItemButton: true
})
});
}