在'index'操作的视图中部分显示'show'操作 - rails

Question

我有一个属性搜索页面(:controller => 'properties'，:action => 'index')，它由一个右边栏组成，右边栏有一个搜索表单，在表单下面显示搜索结果。当用户单击右边栏中的一个属性时，我希望在左侧索引页的主区域中显示该属性的详细信息。

右边栏是一个名为properties/_property.html.erb:

的部分

<%= form_tag properties_path, :method => 'get' do %>
<%= text_field_tag 'location', (params[:location]) %>
<%= select_tag(:max, options_for_select([['No Max', ""], ['$100,000', 100000], ['$200,000', 200000], etc %>
more search fields for baths beds etc
<%= submit_tag "Search", :name => nil %>
<% end %>
<% @properties.each do |property| %>
<%= link_to([property.Address,property.City].join(", "), {:action => 'show', :id => property.id}) %>
<li><strong><%= number_to_currency(property.Price, :precision => 0) %></strong></li>
etc etc
<% end %>

我知道如何显示属性详细信息的唯一方法是使用'show'操作，但这会将用户带到一个新页面，例如localhost:3000/properties/1865。我已经使"显示"视图与"索引"视图相同的布局，并使右侧栏部分(属性/_property.html.erb)出现在"显示"one_answers"索引"上，所以当用户单击右侧栏中的属性并转到localhost:3000/properties/1865时，属性详细信息在主区域正确显示，右侧栏在右侧。

但是因为localhost:3000/properties/1865与localhost:3000/properties/index是一个不同的页面，所以右边栏的搜索表单忘记了它的参数，这意味着右边栏的搜索结果列表已经变回了所有属性的默认列表。

如何在索引页的部分中显示'show'操作，以便用户的搜索参数被右边栏中的表单记住?或者，如果我必须去"显示"页面，我如何使右边的边栏保持原样?

任何想法都非常感谢，只要一个正确方向的建议就好了，我花了一整天的时间想弄清楚，但一无所获，谢谢

Answer 1

我已经使显示视图与索引视图和相同的布局将右侧栏设置为partial (properties/_property.html.erb)在show和index中同时出现。

是的，但这只会让你两个页面的布局相似。您希望该列表在不同请求之间持久化。

你基本上有两个选择。使用session来记住我不推荐的列表。

另一种方法是使用form:remote => true或ajax，部分更新页面。

编辑:

你使用的是什么版本的rails ?你的应用程序中是否加载了jquery ?

关注这个SO POST。

你可能需要稍微改变一下你的show动作。

respond_to do |format|
  format.js {render :partial => 'property_details' ,:layout => false}
  format.html 
end

为属性细节创建一个局部，只把主体内容放在这里。

link的格式是

<%= link_to "link name", {:action => :show, :id => item_id}, :remote => true ,:html => {:class => 'links_product'} %>

还可以更新您可能使用的视图(确保您的页面中有rails.js):

$(document).ready(
     function(){
          $("a.links_product").bind("ajax:success",
                   function(evt, data, status, xhr){                           
                        $("#response").html(data); // in case data is html. (_*.html.erb)
           }).bind("ajax:error", function(evt, xhr, status, error){
                   console.log('server error' + error );
           });
});

使用id为response或任何有效id的div。完成了!