Workshop 5
May 20, 2009
Part A: Viewing the action
1. Create the Rails application framework in the projects folder: C:\InstantRails\…\projects\>rails animals
I created a folder called “projects” under the folder “rails_apps”, and create the Rails application under this folder. However the application couldn’t be loaded. Spent some time on troubleshooting but still couldn’t find the cause. Finally gave up, and my Rails application is under the folder “rails_apps” instead.
2. Running the application on localhost:3000 using the WeBrick ruby server (or Mongrel as alternative) and access via Web browser at http://localhost:3000/
It shows the “Welcome aboard” page.
3. Create the controller to make the application do an action. This is under the controller-action/model-view structure. Stop the WEBrick server each time you edit Ruby classes and then re-start or refresh the views you are testing. Use the Ruby command below:
>ruby script/generate controller Mammal
The mammal_controller.rb contains just a bare class description:
class MammalController< ApplicationController
end
and the ApplicationController class inherits from ActionController::Base class in the ActionController module under Rails.
4. Test the controller by starting the WEBrick server and navaigatibng the browser to http://localhost:3000/mammal Note how the controller name is appended to the end of the URL and that no action resulted because there are no controller methods.
I got an “Unknown action” page.
5. Create an action by editing and saving the mammal_controller.rb class in projects\animals\app\controllers using your text editor to add the method below:
class MammalController< ApplicationController
def breathe
end
end
6. Start the WEBrick server and browse at http://localhost:3000/mammals/breathe where you will get a “missing template” message since it is missing a view for the breathe method.
Rails is trying to connect the breathe method action of the mammal controller to a view, by using the action’s name – breathe. This view template is created as breathe.rhtml and stored in the \projects\animals\views\mammal directory.
7. Create and save a view in that directory by using a text editor to create a view called breathe.rhtml
<html>
<head>
<title>Breathe Easy</title>
</head>
<body>Inhale and Exhale
</body>
</html>
Restart the WEBrick serve r and browse again at http://localhost:3000/mammals/breathe
8. Try Ruby code and HTML in the action view by using the <%….%> wrapper around the inserted Ruby code. Here are some snippets to try from workshop 4:
| <br>
5 + 6 =<%= 5 + 6 %> </br> |
<br>
=<% 4.times do %> Inhale Exhale <br> <%end%> |
<br>
Time is <%=Time.now %> </br> |
NOTE: in practise you normally perform calculations in the action (method) and pass the results to the view.
The link should be http://localhost:3000/mammal/breathe instead. The page just show the content defined in breathe.rhtml
Part B: The active view: passing data freom an action to a view
1. Create a new application called scenery in the same projects directory to demonstrate the use of an active view.
> rails scenery
> cd scenery
A Rails application is created.
2. Create a controller called Demo in scenery\app\controllers
scenery> ruby script/generate controller Demo
A new controller is created.
3. Add an action to demo_controller.rb as the method called rubycobe
class DemoController< ApplicationController
def rubycode
end
end
4. Add a view template – scenery\app\views\demo\rubycode.rhtml
We will edit this view in later steps but you may like to add your own test HTML code to the view at this stage.
5. Save and restart the Web server and navigate to http://localhost:3000/scenery/rubycode
The link should be http://localhost:3000/demo/rubycode instead. No content is shown because nothing was wrote into the view page.
6. Use the Time.now example to pass data from an action to a view.
7. Modify and save the rubycode action with a value for the time instance variable in the DemoController class in app\controllers\demo_controller.rb
class DemoController< ApplicationController
def rubycode
@time_now = Time.now
end
end
8. Then modify and save the corresponding view template in \app\views\demo\rubycode.rhtml by adding a call by reference to the action’s instance variable:
<br>
The time is <%= @time.now %>
<br>
9. Restart the Web server and navigate the browser to http://localhost:3000/demo/rubycode
The variable in rubycode.rhtml should be @time_now instead. It should the current server time.
Data has been passed from the action to the view as it is done with SQL requests. The instance variables of a Ruby class care available to view templates by referencing the action’s instane variables by name in the view .rhtml template.
Part C: Screen layouts and forms processing with text fields, check boxes, radio buttons and multiple list controls
1. Create a new application called cabs in the same projects directory to demonstrate the use of an active view.
> rails cabs
> cd cabs
2. Create a controller called Vehicle in cabs\app\controllers
cabs> ruby script/generate controller Vehicle
3. Add an action to vehicle_controller.rb as the method called cabtype
class VehicleController< ApplicationController
def cabtype
end
end
4. Add a view template – cabs\app\views\vehicle\cabtype.rhtml
We will edit this view in later steps but you may like to add your own test HTML code to the view at this stage.
5. Save the view and restart the Web server and navigate to http://localhost:3000/cabs/cabtype
6. Create a file in the public directory – \cabs\public called input.html
<html>
<head>
<title>Forms processing</title>
</head>
<body>
<h1>Booking a Taxi</h1>
<form action =”vehicle” method = post>
Please enter your name.
<br>
<br>
<input type=”text” name =”text1”>
<br>
Would you like to book a taxi?
<input type=”checkbox” name =”check1”>Yes
<br>
<br>
Please select the type of taxi:
<input type=”radio” name =”radios1” value =”Sedan”>Sedan
<input type=”radio” name =”radios1” value =”Wagon”>Wagon
<input type=”radio” name =”radios1” value =”Disable”>Disable
<input type=”radio” name =”radios1” value =”Maxi”>Maxi
<br>
<br>
What type of building is at your address?
<br>
<select name=”building1[]” multiple size=”3”>
<option value=”Unit”>Unit
<option value=”House”>House
<option value=”Business”>Business
</select>
<br>
<br>
<input value=”submit”/>
</form>
</body>
</html>
7. Edit the vehicle_controller.rb here is a start. The data in each form element in the Rails application can be accessed via its name and a hash called params
class VehicleController< ApplicationController
def cabtype
@data1 = params[:text1]
@data2 = params[:check1]
@data3 = params[:radios1]
@data4 = params[:building1]
end
end
8. Edit the view template cabtype.rhtml
<html>
<head>
<title>Reading the forms data</title>
</head>
<body>
<h1>Booking a Taxi</h1>
Please check the data that you selected below.
<br>
<br>
Your name is <%= @data1 %>
<br>
Your choice to book a tax was:
<br>
<%= if @data2 %> You chose YES.
<%= else %> You did NOT make a choice.
<%= end %>
<br>
Your preferred taxi is a <%= @data3 %>
<br>
The building at your address is a <%= @data4 %>
<br>
<br>
</body>
</html>
9. Start the Web server and go to the opening page of this application at http://localhost:3000/input.html
10. Submit the forms data. What do you find?
Syntax error. The if else end was incorrect. The correct one should be<% if @data2 %> instead of<%= if @data2 %>. The symbol “=” is asking ruby to print out the value of the variable, that’s why it should be present in if else end statement. After debug the data I input was displayed.
11. Report your progress or findings in your Developers Blog.
