autocomplete with static-data updates model with label (text) not value (id)

[jriemer]

I use autocomplete with static-data, the data object looks like this:

var customers = [
	  { value:1, label: "Org one" }
	, { value:2, label: "Org two" }
]

In order for the autocomplete to filter on label I set the “field” attribute to “label” like this:

<q-input v-model="idOrg">
<q-autocomplete
      :static-data="{field:'label',list:customers}"
     :min-characters="0"
    @selected="selected"
  />
</q-input>

When selected the model (idOrg) gets updated with the label (text) not the value (id).
I know I can create multiple “selected” methods or pass on arguments to it to change this (wrong) update to ID.
Can I avoid this? How can I configure the autocomplete to filter by “label” but update with “value”?

thanks
jr

[s.molinari]

Sorry I missed that the code above was your boot file. I’m no expert on Vuex, but that isn’t how the plug-ins can be added after the store has already been constructed.

Have a look at this. https://stackoverflow.com/questions/50959594/dynamically-register-a-vuex-plugin

Not sure it will work with that plug-in (as the answer also notes), but it might be worth a try.

Scott

[jriemer]

Thanks for your reply molinari.
I don’t use Vuex, its a simple, out of the box Vue app with Quasar.
Please see the following codepen: https://codepen.io/jriemer/pen/BEpXNe
Goal: search by label (name), select the value (id)

[s.molinari]

Oops. I posted in the wrong thread. Sorry about that.

Not sure this is what you are looking for, https://codepen.io/smolinari/pen/WWpdVG.

But, it gives you the value.

Scott