[Vuejs]-JavaScript – Validate dropdown using Vue.js

by

0👍

✅

Since the model associated to the SELECT element is notificationPreference, you need to evaluate the model variable:

if (!this.notificationPreference){ // is null or zero
  alert("Please select a service");
}

See https://v2.vuejs.org/v2/cookbook/form-validation.html for more information

0👍

you can do it with watch:
Hope this helps.

<div id="app">
    <select name="notificationPreference"  v-model="notificationPreference">
        <option value hidden></option>
        <option value="1">Email</option>
        <option value="2">Text Message</option>
        <option value="3">Email and Text</option>
    </select> </td> </tr>
</div>

var vm = new Vue({
   data:{
       notificationPreference:''
   },
   watch:{
       notificationPreference:  function (val) {
           if(val == 0){
                alert("Please select a service");
                e.preventDefault();
                return false;
           }
       }
   }
});

Leave a comment