Real forms are rarely static. A field is only shown when another has a certain value, a title is checked for duplicates while the user types, a price is recalculated on the server as options change, and nothing must be submitted twice. Unpoly lets you build all of this without writing a client-side copy of your business logic. This card teaches the patterns.
Important
Work on this lesson in
advisormode.
Learning goals
- You can explain how server-side validation of single fields works while the user is still filling out the form, and why the rules stay on the server.
- You can build forms whose visible fields depend on other fields, e.g. showing a section only for a certain choice.
- You can build forms where the server recomputes parts of the form as the user changes values, and explain when this is better than client-side logic.
- You can prevent double submissions and give users feedback while a form is being processed.
- You can decide which of these patterns a requirement needs, and keep the form understandable when several are combined.
Resources
Read what's new to you, skim what's familiar, skip what you already master. Stop when you can meet the learning goals.
Your agent can also generate an overview, a tutorial or an explanation for anything here, tailored to what you already know. Just ask.
- 📄 Validating forms Show archive.org snapshot — server-side validation of single fields while the user types
- 📄 Switching form state Show archive.org snapshot — showing and hiding fields depending on other fields
- 📄 Reactive server forms Show archive.org snapshot — the server recomputes parts of the form as values change
- 📄 Disabling forms while working Show archive.org snapshot — preventing double submissions and giving feedback
Exercises
Note
Exercises are designed in the exercises sweep. Candidates: (1) the movie form checks the title for an existing movie while typing and shows a link to it; (2) the film-type select shows or hides fields that only apply to one type; (3) a showtime form recomputes available seats or prices on the server as the user changes cinema and date; (4) all forms are disabled while submitting.
