In this lab, you'll practice building nested forms in Sinatra for creating teams of superheroes. No database is required, but feel free to add persistence after you have successfully completed the instructions below.
- Create a route that responds to a GET request at
/
. - Create a view with a form and render it in the GET
/
route. - The form should have fields for the
name
of a superhero team and theirmotto
. - There should be form inputs for each of the three superhero member's
name
,power
, andbio
.
It should look something like this:
- Create a route that responds to a POST request at
/teams
. - Have the form send a POST request to this route.
- Upon submission, render a template that displays the submitted team data and each member's data.
Your params should be nested. For example, in order to see all the superheroes for the team you just created you would enter:
params["team"]["members"]
If you wanted to access the first superhero's name, you would enter:
params["team"]["members"][0]["name"]
When you post to this form you should render a page that displays the name of the team and each member of the team, along with their name, super power and bio.
Your view should display something like this:
Pass the tests! You'll notice in super_sinatra_spec.rb
in theit submits the form
test for 'POST /teams'
, we use the Capybara method fill_in
:
fill_in("member1_name", :with => "Amanda")
fill_in("member1_power", :with => "Ruby")
fill_in("member1_bio", :with => "I love Ruby!")
The same pattern follows for the second and third superheroes. The word in quotes after fill_in
needs to be set as an ID in the form to create the superheroes:
<input id="member1_name" type="text" name="team[members][][name]">
NOTE: If you run into any trouble with Sinatra's default configuration, such as needing to set the views
directory for a particular controller (or to something other than the default views
folder at the top level of your application directory), take a spin through the Sinatra configuration documentation, the Getting Started guide, or the old standbys, Google and StackOverflow.
View Sinatra Nested Forms Lab: Superheroes! on Learn.co and start learning to code for free.