I’m starting to build a multi-step/page ‘wizard’ form, but from these forums and web tutorials, struggling to find the idiomatic way to build a dynamic form.
The simplest use case is:
User clicks or presses Enter to choose an option from a select,
Depending on the option another form element is displayed eg another select or radio buttons or a text field.
Some steps/pages will have forms that have 3-5 elements, each depending on the previous one.
I know this is one of the most basic use cases for LiveView, but I’m struggling to find a simple example.
Can anyone please point to one in these forums or in an online tutorial or put an example up below?
Here are some links that might be helpful:
I’ve been building a out a multi-step join/checkout flow and I’m liking the results. I used
https://www.markusbodner.com/2019/05/31/multi-step-form-using-phoenix-live-view/ for inspiration.
The problem I’m having is with multiple fields on the same step, and validations called for all fields at the same time. Meaning that whenever name is starting to be filled them the error message for empty email shows up. I could solve it by having either field as a separate “step” but that would te…
Thanks, that second link is good. I’ve tried to understand the first one, but it’s broken up in a way that I find confusing.
If anyone has a simple example of dynamic/nested elements within a form, I’m still keen to see it.
Bumping this in regards to Phoenix Liveview 0.16.1
Anyone have any code they can share with a very simple example of the use case I have outlined in my original post here?
The good news is that there is very little to do to update my older blog post mentioned above to 0.16.1:
And making the update further cleans up the code a bit (
You can follow the
changelog guide and reference the live view docs as well. After the update, you can totally get rid of the
templates/person_registration and just render it all in your live view with that wonderful
Here’s a new updated post with the changes:
Hope it helps