Workshop 5: Admiring the secenery Forms, AJAX screen layout and and mobile interfraces: Part C Screen layouts and forms processing:

1. Create a new application called cabs in the same projects directory to demonstrate the use of an active view.

> rails cabs
> cd cabs

Result in my computer:


2. Create a controller called Vehicle in cabs\app\controllers cabs> ruby script/generate controller Vehicle

Result in my computer:


3. Add an action to vehicle_controller.rb as the method called cabtype

class VehicleController < ApplicationController
def cabtype
end
end

Result in my computer:


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.

I copy the breathe.rb from the above animal application into scenery\app\views\demo and rename the file to cabtype.rb

5. Save the view and restart the Web server and navigate to http://localhost:3000/cabs/cabtype

Result in my computer:


I change the navigate to http://localhost:3000/vehicle/cabtype, the result is OK now:


6. Create a file in the public directory - \cabs\public called input.html

I had created a file in the public folder (\cabs\public) called input.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

The vehicle_controller.rb in my computer:


8. Edit the view template cabtype.rhtml

The cabtype.rhtml in my computer:


9. Start the Web server and go to the opening page of this application at http://localhost:3000/input.html

Result in my computer:


10. Submit the forms data. What do you find?

When I submit the forms with the data that provided, the current Web page are redirected from input.html to vehicle (call the vehicle controller to display the user input). But an error page return. The error occur in the action controller for invalid authenticity token. In the error page, list out the parameter that I had input.

Result in my computer: