Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Default v-form validation #1601

Closed
nelxaz opened this issue Sep 6, 2017 · 7 comments
Closed

Default v-form validation #1601

nelxaz opened this issue Sep 6, 2017 · 7 comments
Assignees
Labels
T: bug Functionality that does not work as intended/expected

Comments

@nelxaz
Copy link

nelxaz commented Sep 6, 2017

Steps to reproduce

Designate a default (valid) value to a field in v-form

Versions

Vue 2.4.2
Vuetify 0.15.2

What is expected ?

Unfilled field should be able to be filled and enabling the button (Going from red to green)

What is actually happening ?

I have to interact with every input in the v-form so it validates even the default inputs. When interacted with it does the expected behavior, changing the button color

Reproduction Link

https://codepen.io/nelxaz/pen/xLemZB

Disclaimer

I'm not sure if I'm managing this incorrectly and could/should be done another way so it can animate the button. Thanks for reading.

@Saduff
Copy link

Saduff commented Sep 6, 2017

+1, I just ran into the same issue where I have an optional text field. Have to click on the text field and blur it for validation to pass.

@nekosaur
Copy link
Member

nekosaur commented Sep 6, 2017

I'm not sure I understand. What exactly is not working in the codepen you posted?

@nekosaur nekosaur added the pending review The issue is still pending disposition label Sep 6, 2017
@Saduff
Copy link

Saduff commented Sep 6, 2017

Don't touch the name field. Type in a valid email and select an item. The Submit button should turn green, but it doesn't. Now click on the name field and then anywhere else so it loses focus. Now the Submit button turns green.

I have the same problem, but in a stepper with a disabled button. There is an optional text field with no rules. Can't click on the Continue button (it's disabled) to advance the stepper without focusing the optional field first (to enable the button).

@KaelWD
Copy link
Member

KaelWD commented Sep 6, 2017

This should be fixed with #1581

@Saduff Can you post a codepen with the stepper issue so I can test my changes against it?

KaelWD added a commit to KaelWD/vuetify that referenced this issue Sep 6, 2017
@johnleider
Copy link
Member

I can confirm that #1581 resolves this. This ticket will close once that is merged

@johnleider johnleider added T: bug Functionality that does not work as intended/expected and removed pending review The issue is still pending disposition labels Sep 7, 2017
@johnleider johnleider self-assigned this Sep 7, 2017
@Saduff
Copy link

Saduff commented Sep 7, 2017

@Saduff Can you post a codepen with the stepper issue so I can test my changes against it?

It's not really related to the stepper. I'm sure if the button turns green like it's supposed to then the button in the stepper will also be enabled. The only real difference is just whether you're changing a class like here or the disabled prop. The stepper was more of an example of where this bug might be a problem.

@lock
Copy link

lock bot commented Apr 15, 2019

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs. Please direct any non-bug questions to our Discord

@lock lock bot locked as resolved and limited conversation to collaborators Apr 15, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
T: bug Functionality that does not work as intended/expected
Projects
None yet
Development

No branches or pull requests

5 participants