Level 1
Its now possible with Choices.js version 11. You need to use the 'addChoices' option.
1 like
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
I created this Vue component:
<script>
import Choices from 'choices.js';
export default {
props: {options: [Array, Object], name: String, modelValue: [String, Number], disabled: Boolean, required: Boolean},
emits: ['update:modelValue'],
mounted() {
this.choices = new Choices(this.$el, {allowHTML: true, removeItemButton: true, addItems: true}).setChoices(this.options, 'id', 'name', true);
},
watch: {
modelValue(newValue, oldValue) {
newValue ? this.choices.setChoiceByValue(newValue) : this.choices.removeActiveItemsByValue(oldValue);
},
disabled(newValue)
{
newValue ? this.choices.disable() : this.choices.enable();
}
}
}
</script>
<template>
<select class="form-control" @change="$emit('update:modelValue', $event.target.value)" :value="modelValue" :name="name" :id="name" :disabled="disabled" :required="required"></select>
</template>
and it works fine but I can not add capability to add item to option from search input. when I search something that not in options it says no results found. I even added addItems: true but still nothing happening.
Please or to participate in this conversation.