Menu
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!
864
The other way we can achieve preventing the default form submission behaviour is by attaching a submit event with the prevent modifier to the starting form tag in the template. This will prevent the page from reloading when the submit button is pressed as well.
We use the preventDefault() method with this event to prevent the default action of the form, that is prevent the form from submitting. Example: HTML.
To prevent an event's default behavior, we can call the . prevent modifier in Vue, which calls the native event. preventDefault() method. This series of steps prevents the event from reloading the page after the form is submitted.
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();
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
