Hillcow
Hillcow

Reputation: 969

Vue.js: Prevent form submit only if condition true

I am using VeeValidate for validating a form. However, I want to submit the form without using JS. However, I still want users not to be able to submit, if there are any errors. If I use

<form @submit.prevent="validateBeforeSubmit">

it is disabling the default action completely.

Can you think of any solution to this? Thank you!

Upvotes: 5

Views: 5840

Answers (2)

Majid
Majid

Reputation: 15

Try to add () for validateBeforeSubmit like this:

<form @submit="validateBeforeSubmit()">

Upvotes: 0

Decade Moon
Decade Moon

Reputation: 34286

I'm not familiar with VeeValidate, but why not try something like this:

<form @submit="validateBeforeSubmit">
validateBeforeSubmit(e) {
  if (this.errors.any()) {
    // Prevent the form from submitting
    e.preventDefault();
  }
}

Upvotes: 7

Related Questions