[Vuejs]-How to pass, from <input>, a different value that the chosen one

by

1👍

✅

The answer in your edit is close. You need to bind the value.

<option v-for="name in foundNames" :value="name">{{name._source.interesingelementtodisplay}}</option>

or

<option v-for="name in foundNames" v-bind:value="name">{{name._source.interesingelementtodisplay}}</option>

Note the : in front of value. If you do not bind it, it will just be the literal value between the quotes, which, as you found, is just name.

👤Bert

1👍

Simply just value should do the first thing you were looking for.

<input id="searchedName" list="foundNames">
<datalist id="foundNames">
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</datalist>
👤Billy Ferguson

1👍

I had a similar problem once, what I did was something like this

<datalist id="foundNames">
  <option value="{'choice': 'one', 'value': 1, 'weather': ['cloudy', 'rainy']}">One</option>
  <option value="{'choice': 'two', 'value': 2, 'weather': ['cloudy', 'rainy']}">Two</option>
  <option value="{'choice': 'three', 'value': 3, 'weather': ['cloudy', 'rainy']}">Three</option>
</datalist>

Notice I had to change a little that JSON to use just a single quote, and then to parse it back to JSON I had return to double quote. Nowadays it may be some lib to do that, like this https://github.com/jcoc611/cassandraMAP

👤Ramon Marques

Leave a comment