I am trying to create selected dropdown with vue JS The code following :
<select v-model="selected"> IDR
<option value="IDR"><strong>Mata Uang</strong> </option>
<option>Rp Indonesia Rupiah</option>
<option>US$ U.S.Dolar</option>
</select>
So the question is how do i give name select tag? i try to add "IDR" but still can't show the "IDR" text How to solve this or any suggestion about this?
I'm not 100% sure, wether i understand the question correct. You can add some name or ref attribute to the select either via HTML or the vue api for ref.
<select v-model="selected" name="IDR" ref="IDR">
<!-- Options -->
</select>
However, if you want to display a default option to the user then have a look at this answer.
The below code helps to get name and value:
var app = new Vue({
el: '#app',
data (){
return {
selected:null
}
},
methods:{
onChange(e){
console.log("name:" + document.getElementsByTagName("select")
[0].getAttribute("name") + " value:" + e.target.value )
}
}
});<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<div id="app">
<select @change="onChange" v-model="selected" name="IDR">
<option value="IDR"><strong>Mata Uang</strong> </option>
<option>Rp Indonesia Rupiah</option>
<option>US$ U.S.Dolar</option>
</select>
</div>