I have a v-select in my project, with set of items, which are ing from my local storage. What i want to achieve is to allow user to input some data in v-select (some data, what do not exist in my storage or items), as well as selecting data from items of v-select and allow them to save it. I tried to do it from @change, but no luck for me. Is it any way to do this properly with vuetify/vue, or i should use some additional libraries? Here is my code of my v-select

           <v-select
          item-text="title"
          item-value="title"
          value="source.position"
          label="position"
          dense
          autoplete
          :items="getPositions()"
          @change="jobPositionUpdate">
        </v-select>

Thank you in advance!

I have a v-select in my project, with set of items, which are ing from my local storage. What i want to achieve is to allow user to input some data in v-select (some data, what do not exist in my storage or items), as well as selecting data from items of v-select and allow them to save it. I tried to do it from @change, but no luck for me. Is it any way to do this properly with vuetify/vue, or i should use some additional libraries? Here is my code of my v-select

           <v-select
          item-text="title"
          item-value="title"
          value="source.position"
          label="position"
          dense
          autoplete
          :items="getPositions()"
          @change="jobPositionUpdate">
        </v-select>

Thank you in advance!

• javascript
• vue.js
• vuejs2
• vuetify.js

• 1 Can you please show us your ponent too? Maybe even a working copy... – Francis Leigh Commented Mar 16, 2018 at 15:16
• is jobPositionUpdate being called when the select box changes? It should – ProblemsOfSumit Commented Mar 16, 2018 at 20:14
• 1 I think this question is related. – Traxo Commented Mar 17, 2018 at 9:58

1 Answer 1

It seems to me you need to use bobox. According to Vuetify Website "With Combobox, you can allow a user to create new values that may not be present in a provided items list."

<v-bobox
   v-model="selected"
   item-text="title"
   item-value="title"
   value="source.position"
   label="position"
   dense
   :items="getPositions()"
   @change="jobPositionUpdate">
</v-bobox>

Adding a v-model helps with tracking all the things user has selected and/or added to bobox.

Another tip is that using autoplete in v-select is deprecated. see. You can use <v-autoplete> instead