這章中使用的示例，會延續上一章創建的Rails應用chapter2，但是我們會創建一個新的controller。在終端下執行：
script/generate controller chapter3 index get_time repeat reverse
這行命令生成了一個controller chapter3，4個action：index， get_time, repeat和reverse。
在上一章中，我們給出的示例頁面都是平淡無奇的，這次我們用一個HTML layout和一個CSS文件把頁面打扮一番。首先創建一個新的layout文件，app/view/layouts/application.rhtml，裏面寫一個基本的XHTML模板：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html
xmlns
="http://www.w3.org/1999/xhtml"
xml:lang
="en"
>
<
head
>
<
title
>Ajax on Rails
</title>
<
%= javascript_include_tag :defaults %
>
<
%= stylesheet_link_tag "application" %
>
</head>
<
body
>
<
h1
>Ajax on Rails
</h1>
<
%= yield %
>
</body>
</html>
在這個模板中我們實現了兩個重要的目標，首先是通過javascript_include_tag :defaults這條語句包含了Prototype和script.aculo.us(具體包括prototype.js, effects.js, dragdrop.js和controls.js)，也有application.js, 第二個就是yield，這是插入action模板的地方。為了模板能更好看些，讓我們來做一個簡單的css文件，位於public/stylesheets/application.css:
body {
background-color:
#eee;
color:
#222;
font-family:
trebuchet;
padding:
0;
margin:
25px;
}
h1 {
margin:
-25px -25px 20px -25px;
padding:
50px 0 8px 25px;
border-bottom:
3px solid #666;
background-color:
#777;
color:
#fff;
font:
normal 28pt georgia;
text-shadow:
black 0px 0px 5px;
}
a {
color:
#229; }
.box {
border:
1px solid;
width:
100px;
height:
100px;
padding:
5px;
font-size:
.6em;
letter-spacing:
.1em;
text-transform:
uppercase;
margin-bottom:
20px;
}
.pink {
border-color:
#f00;
background-color:
#fcc;
}
.green {
border-color:
#090;
background-color:
#cfc;
}
.hover {
border-width:
5px;
padding:
1px;
}
ul {
background-color:
#ccc;
padding:
5px 0 5px 30px;
}
接着，我們來充實一下controller中的內容，編輯app/controllers/chapter3_controller.rb定義一些一會兒會用到的action：
class Chapter3Controller < ApplicationController
def get_time
sleep 1.second
render :text => Time.now.to_s
end
def repeat
render :text => params.inspect
end
def reverse
@reversed_text = params[:text_to_reverse].reverse
end
end
下一步就是添加視圖模板中的內容
app/views/chapter3/index.rhtml 就一行代碼：
<%= link_to "Check Time", :action => 'get_time' %>
這裏應用了like_to這個helper，上章介紹過了，它相當於下面的html代碼：
< a href ="/chapter3/get_time" >Check Time </a>
在瀏覽器中打開這個頁面，就會看到下圖所示的畫面，點擊鏈接，get_time這個action會呈遞一個當前時間的文本。
link_to有幾個注意的選項，首先， :confirm允許添加一個javascript的確認對話框，用户可以在執行之前選擇取消，假設你有一個鏈接引發一個潛在的危險動作：
<%= link_to "Fire missile", { :action => 'fire' },
:confirm => "Are you quite sure?" %>
這裏可以加一個適當的控制，用户可以選擇終止這個動作。
其次，:method選項允許指明HTTP方法是:get, :post, :put, 還是:delete. 也許這些選項顯得有點奇怪，因為一般鏈接只使用HTTP的GET方法，表單只能使用GET或者POST。那麼為什麼Rails這麼做呢？其實這裏有個小騙局，看看我為什麼這麼説：建立一個鏈接，並指定:method：
<%= link_to "Delete", "/people/1", :method => :delete %>
如果你查詢一下helper產生的源代碼，你會看到：
<a href="/people/1"
f = document.createElement('form');
f.style.display = 'none';
this.parentNode.appendChild(f);
f.method = 'POST';
f.action = this.href;
var m = document.createElement('input');
m.setAttribute('type', 'hidden');
m.setAttribute('name', '_method');
m.setAttribute('value', 'delete');
f.appendChild(m);
f.submit( );
return false;">Delete </a>這段代碼截獲了link的動作，所以當點擊鏈接之後，幕後創建並且提交了一個表單。對於鏈接本身來説，這個:method只允許鏈接發起POST請求。那麼PUT和DELETE呢？為了讓他們工作，Rails使用POST方法來實現，你可以看到上面代碼中生成的Javascript的那句，一個名為_method的字段添加到了隱藏的表單中。當Rails的服務器端收到這個參數，就會以這個參數提供的方法來解釋執行這個請求。
對於正確使用HTTP 方法在第六章會深入討論。
本文轉自 fsjoy1983 51CTO博客，原文鏈接：http://blog.51cto.com/fsjoy/91136，如需轉載請自行聯繫原作者
