<button type="submit"
class="register-button"
:class="(isDisabled) ? '' : 'selected'"
:disabled='isDisabled'
v-on:click=" isFirstScreen"
@click="persist" >
PROCEED
</button>email:'',
maxemail:30,
validationStatus: function (validation) {
return typeof validation != "undefined" ? validation.$error : false;
},
computed: {
isDisabled: function(){
return (this.fullname <= this.max) || (this.mobile.length < this.maxmobile)
|| (this.gstin.length < this.maxgstin) ||
(this.email <= this.maxemail) || !this.terms || !(this.verified == true );
}
isEmail(e) {
if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(value))
{
this.msg['email'] = '';
} else{
this.msg['email'] = 'Invalid Email Address';
}
}, <input
type="email"
v-model.trim="$v.email.$model"
v-validate="'required'"
:class="{ 'is-invalid': validationStatus($v.email) }"
name="email"
class=" input-section"
placeholder="Enter your company email ID"
:maxlength="maxemail"
v-on:keypress="isEmail($event)"
id='email' v-model='email'
/>
<div v-if="!$v.email.required" class="invalid-feedback">
The email field is required.
</div>
<div v-if="!$v.email.maxLength" class="invalid-feedback-register">
30 characters only
{{ $v.user.password.$params.maxLength.min }}
</div>Currently facing issues with email address validation. Even after entering a short email address, the button gets enabled and moves to the next page. I need the button to be disabled until a valid email address is entered. Any help on resolving this issue with the provided code would be appreciated.