Phoenix doesn't show errors in all multi step form

Hello guys.

I’ve been having some trouble to understand this behaviour about liveview, live_flash and multi step forms.
It would be great if someone could be able to explain why this is not working.

I create a Multi step form on live view to test how it works and reach what I expected.

  • At first time, I want form be fullfilled without show any error.
  • Only show can’t be blank errors when I submit the form on step 3

I followed the documentation and had success in my implementation but there’s one thing that I was not able to understand. I’m trying to not depends of class css “alert” in my live_flash so in this case I added this clause “if” in my live.html.heex

Because of this “if” in live.html.heex my multi-step-form right now needs to be submitted two times to show erros in all steps. If a go to step 3 and submit at first time, errors only show on step 3 and if I go back to step 2 or 1 nothing will be showed.
If I remove this clause, everything works ok but I really would like to understand why.

To reproduce you can do:

  • Install dependencies with mix deps.get
  • Create and migrate your database with mix ecto.setup
  • Start Phoenix endpoint with mix phx.server or inside IEx with iex -S mix phx.server
  • Open localhost:4000/multi-step-form
  • Go to step 3 and submit only once the form and go back to step 2 or 1 to see that only step 3 show errors.
  • Refresh page and go to step 3 and submit form two times and go back to step 2 or 1 and see everything works normally.

Someone can understand why this is happening just because of this “if” clause on live.html.heex?


I created another project using Phoenix 1.7 and I got the same error using everything default.
Maybe I made some mistake? I can’t understand why it’s only works normally if I do two submits.

to reproduce you can do the same above on version 1.6