2011-05-17 74 views
8

我有一個非常簡單的Post資源,有兩個動作,索引和顯示。我的模板包含一個帶有每個先前帖子鏈接的側欄。我想補充工具欄的鏈接來顯示內容(即的「秀」行動結果)通過AJAXRails - 通過ajax顯示索引和顯示動作的結果

我知道有很多excellenttuts,告訴你如何創建一個使用Ajax提交表單,但這時間我想用它來顯示我的索引的內容並顯示無頁面重新添加的動作

。有沒有什麼體面的教程給出瞭如何做到這一點的提示?

我估計我需要創建一個show.js.erb文件,並告訴我的索引操作來響應js,但我有點卡住得到更多。我不太知道要放什麼東西在控制器的show動作或show.js.erb - 這是一個有點很難想象什麼,我需要做的

PS - 使用Rails 3.0.7,jQuery的1.5

回答

10

得到了這個工作,最後它非常簡單。

步驟1 - 添加:remote => true以下鏈接欄

#application.html.haml 
%nav#sidebar 
    - for post in @posts 
    = link_to post.title, post_path, :remote => true 
%div#main 
    = yield 

步驟2 - 告訴你的控制器到JS迴應在節目行動

def show 
    @post = Post.find(params[:id]) 
    @posts=Post.all # needed for sidebar, probably better to use a cell for this 
    respond_to do |format| 
    format.html # show.html.erb 
    format.js # show.js.erb 
    end 
end 

步驟3 - 創建_post.html.haml

# _post.html.haml 
%article.post 
    = sanitize post.body 

步驟4 - 創建show.js.erb和替換與_POST部分內容的#main DIV的HTML(我們在步驟3中創建)

# show.js.erb 
$("#main").html("<%= escape_javascript(render @post) %>"); 

現在,所有內容通過ajax傳遞,並且工作正常。

+2

有沒有一種方法來使用網址來操縱至極@post顯示? – oFca 2012-07-23 13:39:10

1

我手邊沒有完整的答案,因爲我對此也比較陌生。

但是,我會先看看JQuery的get()方法。您應該可以使用它來調用索引或show方法。這些方法應該返回您想要在頁面的非側欄部分顯示的html。您可以使用get()的回調處理程序將該HTML放入頁面上相應的div中。

對不起,這有點含糊,但如果你玩這個我打賭你會弄明白。

+0

這是一個有趣的想法 - 我相當肯定有一個服務器端這個客戶端方法的靈感 - 對於搜索引擎優化的目的,也因爲我想緩存在服務器上 - 仍然,我會看看這個,看看是什麼我可以找到 - 謝謝 – stephenmurdoch 2011-05-18 00:00:04