computed: {
isDisabled: function(){
return
!(this.errmsg.email < this.email.minemail)
}
watch: {
email(value){
// binding this to the data value in the email input
this.email = value;
// eslint-disable-next-line
console.log("email",this.email);
this.validateEmail(value);
}
},
methods: {
validateEmail(value) {
// eslint-disable-next-line
console.log("email",this.email,value);
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(value))
{
this.errmsg['email'] = '';
} else{
this.errmsg['email'] = 'Invalid Email Address';
}
},
}<input type="text" v-validate="'required'" name="email" placeholder="Enter your company email ID" :maxlength="maxemail" id='email' v-model='email' />
<div v-if="errmsg.email" class="invalid-feedback-register">
{{errmsg.email}}
</div>
<button type="submit" :class="(isDisabled) ? '' : 'selected'"
:disabled='isDisabled' v-on:click=" isFirstScreen" @click="persist" >PROCEED</button>Utilizing a watch function for email input validation which is functioning correctly. However, encountering an issue when attempting to disable the button based on {{errmsg.email}} as it is not working.
If the email is valid, enable the button, otherwise keep it disabled until the user enters the correct email id in the field.