Displaying validation errors in our forms

As of yet, we haven't actually hooked up any of this new shiny logic in our form, so if we try to submit anything we'll just see a generic error message that isn't very helpful. One thing that we left out of each of our forms is a per-field error message. Phoenix will helpfully wrap any errors inside of a span with a help-block class, so first let's open up assets/css/app.css and add the following code:

span.help-block {  color: #f00;}

Next, we'll jump into our users form and start adding error_tag statements to each of our fields. Open up lib/vocial_web/templates/user/form.html.eex and follow along with each field update as follows:

  • Username:
<%= label f, :username, "Username:" %><br /><%= text_input ...

Get Phoenix Web Development now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.