Rails 3使用鏈接呈現不同的部分

Question

我有一個汽車經銷商的項目，在汽車show.html我有頁面左側的照片庫和右側的車輛信息。 車輛信息代碼在部分名為_vehicle_info而庫在_car_gallery這看起來像這樣：

<div id="column-left">
    <%= render :partial => "car_gallery" %>
</div>
<div id="column-right">
    <%= render :partial => "vehicle_info" %>
</div>

在car_gallery我只能看到12張車的照片。

問題：

我想要做的是在car_gallery div附近有一個鏈接，當用戶點擊它時，左側的部分vehicle_info將被部分car_gallery_all替換（這部分包含該車的所有照片，不限於12 ）。 有沒有簡短的方法來做到這一點？ 請幫忙。

Answer 1

由於缺乏代表編輯：

這將適用於rails 3.1，不確定大約3.0或更低..

此外，如果我理解正確的話，davidb的答案將加載所有圖像，無論用戶是否想要查看它們 - 這個解決方案只會在用戶點擊鏈接查看它們時加載它們。

.................................................. ............................

調節器

                def all_car_photos
                  ...
                  respond_to do |format|
                     format.js
                  end
                end

視圖

            <div id="column-left">
                <%= render :partial => "car_gallery" %>
            </div>
            <div id="column-right">
                <%= render :partial => "vehicle_info" %>
            </div>
            <%= link_to "Show All Photos", path_to_controller_action(@car), { :method => :get, :remote => true} %>

all_car_photos.js.erb

            $('#column-right').html("<%= escape_javascript(render "car_gallery_all") %>");

好吧，視圖包含指向all_car_photos控制器操作的link_to方法。 這里的關鍵是link_to包含：remote => true - 這使用烘焙的Rails AJAX功能提交請求。

控制器操作執行它需要做的事情，但是使用.js視圖響應 - all_car_photos.js.erb - 這包含一行jQuery，它將用'car_gallery_all'部分替換'column-right'div的內容。 。

現在已經很晚了，但這個設置應該可行..

Answer 2

添加鏈接並為其提供ID。 你使用“＃”因為它沒有有效地鏈接到任何東西。

<%= link_to "my link text", "#", :id => "replace_vehicle_info" %>

然后你添加一些jQuery到你的public/javascript/application.js （我除了你使用rails 3而不是3.1，因為你的問題被標記為這樣）來替換該div的內容。

$("#replace_vehicle_info").click(function() {
     $("#vehicle_info").replaceWith(<your html here>)
})