Skip to content
This repository has been archived by the owner on Feb 28, 2023. It is now read-only.

A way of "touching" all fields on submit #167

Closed
hognevevle opened this issue Apr 20, 2021 · 4 comments
Closed

A way of "touching" all fields on submit #167

hognevevle opened this issue Apr 20, 2021 · 4 comments
Assignees

Comments

@hognevevle
Copy link

hognevevle commented Apr 20, 2021

Is your feature request related to a problem? Please describe.
When using the approach of touching each field on blur (and not showing the validation.errorMessage before the field is touched - as per the last example here), the current experience is not so great if you were to submit the form without touching all the fields first. The submit event will be cancelled, but still no validation messages will be displayed.

Describe the solution you'd like
Maybe an optional configuration property to forcibly touch all fields upon submit. This would then ensure that all validations are triggered and errors displayed, even when the user did not touch all the fields yet.

Another option would be exposing a property describing if the form is "submittable" (i.e. all validations are passed). That would for example allow us to disable the Submit button whenever the form state isn't valid.

Describe alternatives you've considered
Haven't found any other good solutions to this yet.

Additional context
In my case, I'm using VeeValidatePlugin.

@logaretm
Copy link
Collaborator

logaretm commented Apr 20, 2021

Hey there, you are indeed right. This problem is apparent with formvuelate integration since it doesn't have a concept of handling "validation triggers".

It might be worthwhile to add a new validation flag, e.g: submitted as you suggested to the core of vee-validate which will be reflected in the formvuelate plugin, I will see what I can do and will post updates here.

exposing a property describing if the form is "submittable"

This already exists as valid but it is not available to formvuelate yet, this is a similar request to formvuelate/formvuelate-plugin-vee-validate#8

@logaretm
Copy link
Collaborator

logaretm commented Apr 22, 2021

Quick update, I have researched a little bit and I think introducing this by default in the core vee-validate lib makes more sense than adding a special boolean just for that.

Once this is merged (maybe tomorrow) you can upgrade vee-validate and it should set the fields to touched automatically for you once you submit.

While this closes this issue it doesn't address that formvuelate needs to allow plugins to expose state, which we are working on at the moment.

@hognevevle
Copy link
Author

Awesome, thank you so much! Doing this as default definitely makes sense.

@logaretm
Copy link
Collaborator

Should be up with vee-validate 4.3.3, will add this shortly to the formvuelate documentation.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants