You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Make a validation rule (or more than 1) for the text field. 1st rule should check if the field is filled.
The text field has a @update:modelValue callback that calls formRef.validate() to see if it should perform an action based on the form validity.
Paste a valid value into the text field. (do not type)
Expected Behavior
calling formRef.validate() in the modelValue event handler should show that the form is valid.
Actual Behavior
The 1st validation rule is run with a "" value. Its always just the first. The result of validation is set to false.
Then the rules are run again with the real values.
The result of form validation is still false.
Workaround: Call await formRef.validate() twice in a row.
Feels like this happens the first time a form is validated (first input event).
resetValidation() does the same thing as validate() it seems.
observation (seen in the playground) the v-form's modelvalue is false at the time, but a moment after that handler finishes, it is set to true. Seems like the validation isnt done after validate() promise resolves!
Prior issue (#19089) seems very similar but was closed. They did not call validate() outright there.
In our app we wish to emit some values if the form is valid. This includes while typing or pasting a value.
The text was updated successfully, but these errors were encountered:
I do see a similar issue here: #17501
Please fix this. Calling await formRef.validate() should be expected to work. Not return early with the prior value.
I suppose its understandable if the form isnt updated when update:modelValue is called? But that seems like a confusing limitation.
I've at least logged that there is a workaround for this.
Environment
Vuetify Version: 3.6.8
Vue Version: 3.4.27
Browsers: Chrome 124.0.0.0
OS: Windows 10
Steps to reproduce
Expected Behavior
calling formRef.validate() in the modelValue event handler should show that the form is valid.
Actual Behavior
The 1st validation rule is run with a "" value. Its always just the first. The result of validation is set to false.
Then the rules are run again with the real values.
The result of form validation is still false.
Reproduction Link
https://play.vuetifyjs.com/#...
Workaround
Call await formRef.validate() twice in a row.
Other comments
Workaround: Call await formRef.validate() twice in a row.
Feels like this happens the first time a form is validated (first input event).
Prior issue (#19089) seems very similar but was closed. They did not call validate() outright there.
In our app we wish to emit some values if the form is valid. This includes while typing or pasting a value.
The text was updated successfully, but these errors were encountered: