Vee-validate: this.$validator.validateAll() not working correctly, always submitting form

[wa05]

Versions:

• VueJs: 2.1.10
• Vee-Validate: 2.0.0-rc.6

Description:

Submitting form with errors pass the validation, executes the .then() from the promise..

Going back to rc4

[pavel-mironchik]

Do you check the result of validation within .then() like it is described in rc6 comment?

[logaretm]

Unfortunately there was a breaking change introduced in rc6 which is explained in detail over there on the releases page, the docs hasn't been updated yet to reflect those changes.

[RoopKumar-treselle]

When I expect the new updated documentation or Alternative way to achieve the same behavior

[alejosv]

Same behavior

[qiuling2014]

mmp

[clecocq]

same issue here

[clecocq]

Ok I found this in the release comments

this.$validator.validateAll(result => {
if (! result) {
// handle input errors.
return;
}

// submit the form or whatever.
}).catch(() => {
// this is an actual app logic error.
});

However the code doesn't seem to work by my side (nothing happen)

[clecocq]

Ok I got it working

this.$validator.validateAll().then((result) => {
if(!result){
alert('error');
return;
}
alert('success');
}).catch(() => {
});

[logaretm]

@clecocq Thanks for pointing that out, there was a mistake in release notes that was fixed now.

[CindyConway]

I had an issue with running validateAll() with a complex component: a combobox that converts entries into chips. If I entered a value into the combo, then clicked save (without the combo first losing focus), validateAll returned the incorrect value because the execution of the combobox didn't complete before the validate. I wrapped the whole thing in setTimeout to push validateAll to the bottom of the call stack, then everything was ok:
setTimeout(() => { // setTimeout allows execution of the combo box for the 'to' field to complete before validation runs this.$validator.validateAll() .then((results) => { if (results) { this.$emit('someEvent', this.something); } else { this.showErrors = true; } }); }, 0);