Views Carol Wolf Computer Science. Extended Ruby Views files are written in extended Ruby, erb. They end in.html.erb. Ruby code is intermixed with

Views

Carol WolfComputer Science

Extended Ruby Views files are written in extended Ruby, erb. They end in .html.erb. Ruby code is intermixed with html.

It is enclosed by <% … %> Some code adds and ‘=‘ sign, as in <%= … %>. This guards against a sequel injection attack.

Ruby control blocks require the keyword, end. Lining up control statements with

corresponding ends is tricky.

Forms Forms have been part of html for a long time. They are used to send parameters to the server.

<form method = "post" action="http://localhost:3000/store ">

<p><input type = "text" name = "size" value = "" size = 10 />Size </p>

<p><input type = "text" name = "color" value = "" size = 20 />Color</p>

<p><input type = "submit" value = "Send" /></p>

</form>

Forms have a method, action, text input and a submit button.

Methods Get – Used for moving from one page to

another Parameters are sent in the URL string Rails uses get for path changes

Post – Used in forms Parameters are sent in the packets Rails requires post when using forms

Head, Put, Delete, Trace and Connect See

http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html

Of these, Rails uses Put and Delete.

Actions The action tells the server which controller

method should be executed. Example: action="http://localhost:3000/store

"> Example from Pace Portal

<form name="cplogin" action="https://portal8.pace.edu/cp/home/login" onSubmit="login(); return false;" method="post">

Example from schedule<%= form_for :course, :url => {:action

=> :list_courses} do |form| %>

Text Fields Text fields are used to collect information.

<p><input type = "text" name = “color" value = "" size = 20 />Color</p>

In extended Ruby we would write:<p><label for=“color "> Color:</label>

<%= form.text_field : color, :size => 20 %>

</p>

The label is used to tell the client what to enter. The size attribute determines how many

characters are to be allowed. The value attribute is empty in the html and

doesn’t even appear in the extended Ruby.

Buttons The submit button is standard for forms.

<p><input type = "submit" value = "Send" /></p>

In Rails this becomes<p><%= submit_tag "Send" %></p></h3>

The value attribute in the first example determines what will be displayed on the button.

In Rails, all you have to do is put the value in quotes, "Send“.

In Rails you can have other buttons as well; we use button_to and have to detail the value and action.

The Resulting Code<h3><form accept-charset="UTF-8" action="/store/find_item"

method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓" /> <input name="authenticity_token" type="hidden" value="FDuUCyP4UxnTpRTjrRLX0cZav01MTJIe6n73ES0CrfQ=" /></div> <p>

<label for="size">Size:</label>

<input id="size" name="item[size]" size="10" type="text" /> </p>

<p>

<label for="color">Color:</label>

<input id="color" name="item[color]" size="20" type="text" /> </p>

<p><input name="commit" type="submit" value="Send" /></p>

</form> </h3>

Layouts

Rails supplies a layout for every application. <!DOCTYPE html>

<html>

<head>

<title>Testapp</title>

<%= stylesheet_link_tag :all %>

<%= javascript_include_tag :defaults %>

<%= csrf_meta_tag %>

</head>

<body>

<%= yield %>

</body>

</html>

Layouts The application layout is added to the

application, with the code that comes before the <%= yield %> listed first.

The Ruby command, yield, tells the application to add in the code in the ERB file.

The last two lines are then added to the end.

The result is a complete html page with a header and footer.

Cascading Style Sheets Styles such as B for bold can be added directly into

the html code. Any in the code are always done first. Styles can also be added into the head of the page in

a specific style section. Styles in the body of the html have precedence over these.

Finally styles can be incorporated into a style sheet with extension .css. This is strongly recommended by developers.

The format is very simple. The html tag comes first followed by curly braces. The styles are listed inside the braces, separated by semicolons. And each style is separated from its value by a colon.

Style sheets can be added to the public/stylesheets folder. They will all be added in by Rails.

A sample style sheet for tablestable{

border: 1;

border-style: solid;

border-width: thin;

cellpadding: 10;

}

td {

border-style: solid;

border-width: thin;

padding-right: 0.5cm;

}

Documents

Views Carol Wolf Computer Science. Extended Ruby Views files are written in extended Ruby, erb. They end in.html.erb. Ruby code is intermixed with