2

I'm trying to understand how I can integrate vue-select as a field in vue-formulate. I need a select field for ajax within it but I am having trouble reaching this result! Can anyone help me on how I should do this?

Progman
  • 16,827
  • 6
  • 33
  • 48
Marcos Ferreira
  • 21
  • 1

2 Answers2

2

I had the same question so I created a Vue Formulate plugin: vue-formulate-select. Do tell me if you find any bugs.

For the future, what you need is a custom input in order to keep the Formulate functionality with a different UI.

J Eti
  • 192
  • 4
  • 13
0

You can try this

<FormulateInput
  type="select"
  name="groupid"
  label="Groupid"
  validation="required"
  :options="resArr"
/>

Also if the resArr contains only string or any other elements, then just populate the array fetched from api into resArr. And if the array consits of objects, then the object must consist of label and value key. For ex: In my case the resArr consisted of objects which had group name and groupid, so I wanted to display groupname into dropdown but the value of the selected item would be it's respective groupid, so here the label was groupname and the value was groupid.

resArr = [{label:'Group1',value:1},{label:'Group2',value:2}]
beingyogi
  • 1,316
  • 2
  • 13
  • 25
  • Sorry but I couldn't understand. I tried to follow that line, but I can't do an event to update this array. There is no event trigger for the search on select apparently. I need to search for an ajax call. Can you give me an example of this part of the logic? – Marcos Ferreira Oct 26 '20 at 11:13
  • You can add the code of your component into the question, and then I can tell you the where's the mistake. Or you can follow the [docs](https://vueformulate.com/guide/inputs/types/select/#select-2) – beingyogi Oct 26 '20 at 11:40