ruby-on-rails - 使用 ajax 调用和远程渲染 rails => true

Question

我有一个页面，taxons#show，它列出了一堆产品，当你点击一个产品时，它应该会带你到 products#show，这是单独的产品页面。此页面显示部分 _cart_form.html.erb，它具有将产品添加到购物车、选择尺寸、颜色等的一系列功能。

在 Taxons#show 上，当您单击产品时，我不想转到单个产品页面，而是在 taxons#show 上显示一个灯箱，其中包含 _cart_form.html.erb 部分。我让灯箱正常工作，当您单击图像时，它会正确显示灯箱而不是转到产品#show 页面，但我不确定如何渲染其中的部分内容。这是我目前的链接:

<div class="main-image" id="single_<%= product.id %>" data-productid="<%= product.id %>">
      <%= link_to large_image(product, :itemprop => "image", :class => "product-image", :id => product.id), product_path(product), :remote => true, :html => {:class => "product_popup"}  %>
</div><!-- main-image-->

灯箱代码是一个显示的 div:点击前无显示，如下所示:

<%# ******LIGHTBOX******* %>
<div id="product_popup_<%= product.id %>" class="product_popup" data-popid="<%= product.id %>">
        <div class="related-products">
          <ul class="related_products_list" id="related_products_list_<%= product.id %>" data-listid="<%= product.id %>">
         <% @related_products.each do |related_product| %>
         <li class="related_products_item"><%= link_to large_image(related_product, :itemprop => "image", :data => {:imageid => related_product.id}, :id => "related_" + related_product.id.to_s, :class => "related_products_image dimmed"), url_for(related_product) %></li>
         <% end %>
    </ul>
        </div>
        <div class="popup-image">
        <%= large_image(product, :itemprop => "image", :class => "product-image-popup") %>
</div><!-- popup-image -->

谁能告诉我如何在您单击灯箱内的链接时呈现部分内容？谢谢!

编辑**

当我尝试在 taxons#show 内的灯箱中直接渲染部分时，我收到以下 NoMethod 错误:

 NoMethodError in Spree/taxons#show

 Showing    /home/telegraph/telegraph1/pants.telegraphbranding.com/app/views/spree/shared/_cart_form.html.erb where line #4 raised:

undefined method `has_variants?' for nil:NilClass
Extracted source (around line #4):

1: <%= form_for :order, :url => populate_orders_path do |f| %>
2:   <div id="inside-product-cart-form" data-hook="inside_product_cart_form"     itemprop="offers" itemscope itemtype="http://schema.org/Offer">
3: 
4:     <% if @product.has_variants? %>
5:       <div id="product-variants" class="columns five alpha">
6:         <h6 class="product-section-title"><%= t(:variants) %></h6>
7:         <ul>

[2013 年 9 月 24 日更新]

标记的解决方案解决了上述问题，但导致了一个糟糕的堆栈级别太深错误，导致我放弃了该功能。但我认为这是一个很好的解决方案:

Can't find root of 'stack level too deep' error when rendering partial

Answer 1

我的方法是让您的应用以 AJAX 方式呈现灯箱

products_controller.rb

def show
  @product = Product.find params[:id]
  respond_to :js
end

show.js.erb

$("[id^='product_popup_']").remove();
$(body).append("<%= escape_javascript(render 'product_lightbox', product: @product) %>");

_product_lightbox.html.erb

<%# ******LIGHTBOX******* %>
<div id="product_popup_<%= @product.id %>" class="product_popup" data-popid="<%= @product.id %>">
  <div class="related-products">
      <ul class="related_products_list" id="related_products_list_<%= @product.id %>" data-listid="<%= @product.id %>">
     <% @related_products.each do |related_product| %>
     <li class="related_products_item"><%= link_to large_image(related_product, :itemprop => "image", :data => {:imageid => related_product.id}, :id => "related_" + related_product.id.to_s, :class => "related_products_image dimmed"), url_for(related_product) %></li>
     <% end %>
</ul>
    </div>
    <div class="popup-image">
    <%= large_image(product, :itemprop => "image", :class => "product-image-popup") %>
<%= render 'shared/cart_form' %>
</div><!-- popup-image -->

但是在您的问题中，您实际上并没有说清楚您遇到的问题。您是否尝试过在灯箱代码中渲染部分内容？ :/

编辑 - 根据您的错误，@product是零。所以在你渲染你的购物车部分之前，设置<% @product = product %> ，因为您的灯箱代码看起来像使用 product .否则，只需使用 @product从 Controller 向下，然后您可以拥有呈现全部使用 @product 的部分的 View .

再次编辑 - 或者，将产品对象作为本地对象传递给您的局部对象，例如:<%= render 'bla', :product => product %>并编辑为部分使用 product而不是 @product .