In this section, we’ll create a signup form that accepts an invalid submission and re-renders the signup page with a list of errors.
A working form
Recall from “Showing users” Section that adding resources: 'users' to the config/routes.js file automatically ensures that our application responds to the RESTful URLs. In particular, it ensures that a POST request to /users is handled by the create action.
public/controllers/users_controller.js
public/services/user.js
app/controllers/users_controller.js
We use the bodyParser object to create middlewares. The req.body property return the parsed body, or an empty object ({}) if there was no body to parse.
app.js
Signup error messages
As a final step in handling failed user creation, we’ll add helpful error messages to indicate the problems that prevented successful signup.
As in the console session above, the failed save generates a list of error messages associated with the user object. To display the messages in the browser, we’ll render an error-messages partial on the user new page
public/partials/users/new.html
We then need to create the messageDirective directive
public/directives/message.js
public/app.js
public/index.html
The other new idea is the pluralize.
public/index.html
public/assets/stylesheets/custom.css
The pluralize takes an integer argument and then returns the number with a properly pluralized version of its second argument.
Underlying this method is a powerful inflector that knows how to pluralize a large number of words, including many with irregular plurals.
A test for invalid submission
In the days before powerful web frameworks with full testing capabilities, developers had to test forms by hand. For example, to test a signup page manually, we would have to visit the page in a browser and then submit alternately invalid and valid data, verifying in each case that the application’s behavior was correct.
To get started, we first generate an integration test file for signing up users, which we’ll call users_signup