Vee-validate: Validate Form Before Submit not submitting form when successful

Created on 1 Feb 2017 · 9Comments · Source: logaretm/vee-validate

Versions:

VueJs: 2.1.10
Vee-Validate: [email protected]

Description:

@submit.prevent="validateBeforeSubmit" rule is successfully triggering and alerting but does not submit the form after success.

Steps To Reproduce:

http://vee-validate.logaretm.com/examples#validate-form

Am I missing something?

Source

benj3

Most helpful comment

Here I found the answer. This should be documented not the alert "Form submitted". Thank you @logaretm

validateBeforeSubmit(e) {
    e.preventDefault();
    this.$validator.validateAll().then(() => {
        // Data is valid, so we can submit the form.
        document.querySelector('#myForm').submit();
    }).catch(() => {
        return false
    });
}

guyver-dash on 2 May 2017

👍5

All 9 comments

The form in the docs are prevented at all times, so it doesn't be disruptive when you read the docs, in the code example there is no need to prevent it after success.

logaretm on 1 Feb 2017

I didnt add .submit() to my method so the form was not submitting sorry! Thanks for the work.

benj3 on 1 Feb 2017

@benj3 How did you do it? My form also just alert "Form submitted" but it doesn't load the submission. TY

guyver-dash on 2 May 2017

Here I found the answer. This should be documented not the alert "Form submitted". Thank you @logaretm

validateBeforeSubmit(e) {
    e.preventDefault();
    this.$validator.validateAll().then(() => {
        // Data is valid, so we can submit the form.
        document.querySelector('#myForm').submit();
    }).catch(() => {
        return false
    });
}

guyver-dash on 2 May 2017

👍5

Yep this is what I was missing also :)

benj3 on 2 May 2017

@bobbygerez

Thank you so much.. it works..