How to deactivate select on the vue?

Good day!

I want to implement, select the inactive field, add the field to be mandatory.

At the moment are default data that I have recorded in vue. If a customer accidentally presses submit - in database is filled in with false information. This is not an option.

Immediately after you refresh the page disappears.
<option selected disabled required>Select something</option>


Here is what we have now:

HTML:
<div class="form-group">
 <select name="Course" id="Course" required class="form-control" v-model="selected.list1">
 <option v for="option in list1" :value="option.id" v-text="option.Title" />
</select>
</div>
 <div class="form-group">
 <select name="MorningEvening" id="MorningEvening" required class="form-control" v-model="selected.list2">
 <option v for="option in list2Select" :value="option.id" v-text="option.Title" />
</select>
 </div>


VUE
new Vue({
 el: "#app",
 data: {
 list1: [ { id: 1, Title: 'Choice 1' }, { id: 2, Title: 'Choice 2' }, { id: 3, Title: 'Choice 3' } ],
 list2: [ 
 { id: 1, idForeign: 1, Title: '1' }, 
 { id: 2, idForeign: 2, Title: '2' }, 
 { id: 3, idForeign: 2, Title: '3' }, 
],
 selected: {
 list1: 1,
 list2: 1,
},
},
 computed: {
 list2Select() {
 return this.list2.filter( option => option.idForeign == this.selected.list1 )
}
},
})
March 25th 20 at 12:49
0 answer

Find more questions by tags Vue.jsFrontendCSS