Open rinoldsimon opened 6 years ago
one way of doing is, unique property name for didValidate
For eg:
<div>
<label> Email: <label>
{{validated-input model=this placeholder="Enter new email" valuePath='new_email' id="new_email" didValidate=didValidateEmail}}
<label> Password: <label>
{{validated-input model=this placeholder="Enter current password" valuePath='current_password' id="current_password" didValidate=didValidatePassword}}
<button {{action "changeEmail"}}>Submit</button>
</div>
<div>
<label> Confirmation Token: <label>
{{validated-input model=this placeholder="Enter confirmation token" valuePath='confirmation_token' id="confirmation_token" didValidate=didValidateToken}}
<button {{action "verify"}}>Verify</button>
</div>
and in js set the property to true or false manually for each field:
changeEmail: function() {
this.validate().then(() => {
if (this.get('validations.attrs.new_email.isValid') && this.get('validations.attrs.current_password.isValid')) {
...
....
} else {
this.setProperties({didValidateEmail: true, didValidatePassword: true});
}
});
Is this the only way ?
Environment
Steps to Reproduce
hbs:
js:
Now when I click submit, changeEmail action is called and if validation fails it sets this.set('didValidate', true); which enables all the three validated-input field and shows validation error for even confirmation_token field. But i need to show validation error message only for current_password and new_email. vice versa when verify action is called