Vuetify: [Bug Report] Form with nested dialog containing a form does not validate

[brfrth]

Versions and Environment

Vuetify: 1.0.4
Vue: 2.5.13
Browsers: Chrome 64.0.3282.119
OS: Windows 10

Steps to reproduce

1. Type in the form without nested dialog
2. Open the dialog and type in the form in the dialog
3. Close the dialog and type in the form with nested dialog

Expected Behavior

1. The form validates to true
2. The form validates to true
3. The form validates to true

Actual Behavior

1. The form does in fact validate correctly
2. The form appears to validate correctly
3. The form does not validate at all anymore and always has the validation status of the form in the dialog

Reproduction Link

https://codepen.io/anon/pen/bLJMMb?editors=1010

Other comments

I presume there is a scope issue here. Each form should have it's own scope regardless of where it is. Of course you don't usually nest forms, but a dialog with a form inside may occurr inside a form from time to time (creating related resources for example). The forms should be decoupled.

[johnleider]

I just tested the above and this is what I got:

Can you provide some additional information?

[KaelWD]

The repro steps aren't very clear, but I think this is what he means:

Should be pretty simple to fix, just stop traversing when you hit another v-form.

[brfrth]

@johnleider Yeah. Go ahead with these steps, I just tested them.

1. Type in the input of the form with nested dialog
2. Observe that is does not validate to true
3. Now open the dialog and type in that form, both it and the form wrapping it will be true now

Edit: Ah, seems @KaelWD got it

[luanpotter]

It'd be pretty neat to have a way to nest forms without interference; I created some custom components, that are intended to be used inside forms, and some of them themselves have forms inside them (like a component with a dialog with a text input, or a "list of strings" component).

[johnleider]

Something that should be possible very soon with the form refactor.

On Wed, Mar 28, 2018, 2:52 PM Luan Nico [e-mail] wrote:

It'd be pretty neat to have a way to nest forms without interference; I
created some custom components, that are intended to be used inside forms,
and some of them themselves have forms inside them (like a component with a
dialog with a text input, or a "list of strings" component).

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/vuetifyjs/vuetify/issues/3455#issuecomment-377014341,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AIpOgguSYrvhbVLoec_5S59xlJy4PNn0ks5ti-oagaJpZM4SbA-D
.