Submit Form Button Does not Work in Stepped Container on Step without Form

[dash]

• Goal: Submit Form

I have a FORM inside of a (3) steppedContainer on step 2.
SUBMIT BUTTON loaded on Step 3 (and hidden otherwise)
If I try to use the Submit form on Step 3 (when the form itself on is step 2) it will not submit. However when I unhide the Submit button and toggle back to step 2 where the form is visible, the submit button works just fine.

Based on this other post I saw it appears that this should work since this post indicates they have multiple forms across these steps and it does not appear they are submitting before they move to the next step:

Form validation in Stepped Container

I have a stepped container with a form in each step with the header, footers and submit button hidden in each form. I would like to validate the form when progressing to the next step and cancel navigation when validation fails. However, when i call "form.validate()" and subsequently check "form.invalid" to conditionally navigate the invalid property is always false. I have also tried adding the await modifier but it does not help. So the "form.validate()" method is not await, its returns imme…

Is this expected behavior with forms and submit buttons? Seems strange if it were, so it makes me believe I am missing something. However if I change absolutely NOTHING except unhide the submit button on Step 2 (where the form is) it will submit and do everything else just fine.

[Jack_T]

Hello @dash!

I can try to reproduce this and see if the bug shows up on my end.

Could you share some screen shots of your app on step 2 and step 3?

So the desired behavior is that the user fills out the form on step 2, moved to step 3 and then submits. Which currently only works when the submit button is not hidden on step 2 but triggered on step 3, correct?