Rails将查询视图拆分为两个不同的div

时间:2015-12-31 06:32:00

标签: jquery html css ruby-on-rails

我有以下rails应用程序,我需要将结果传递给视图,因为2行不同的行<div>每行有4个结果,总共8行为2行。

    </section>
        <div class="container landing-content">
            <!-- Projects Row -->
            <div class="row">
                <div class="col-md-12 text-center content-title">
                    <h3>Now trending in Kuala Lumpur</h3>
                </div>
               <% @products.each do |product| %>
                <div class="col-md-3 portfolio-item">
                    <p class="price">RM <%= product.price_cents/100 %></p>
                    <a href="<%= product_path product %>"><img src="<%= product.user.store_setting.store_image.store_img.small%>" class="img-circle user-thumb" width="52"/></a>
                    <a href="<%= product_path product %>">
                    <img class="img-responsive" src="<%= product.product_attachments.first.attachment.small.url%>" width="262" alt="">
                    </a>
                    <h4>
                        <a href="<%= product_path product %>"><%= product.name %></a>
                    </h4>
                    <a href="<%= product_path product %>">
                        <p><%= product.city%>, <%= product.country%></p>
                    </a>
                </div>
                <% end %>
    </div>

       <div class="row">

            <div class="col-md-3 portfolio-item">
</div>
</div>

    </div>
    </section>

问题是,如何将我的8个结果分成2个不同的div?感谢

1 个答案:

答案 0 :(得分:0)

我想我应该从你的观点出发澄清我的想法:

</section>
  <div class="container landing-content">
    <div class="row">
      <div class="col-md-12 text-center content-title">
         <h3>Now trending in Kuala Lumpur</h3>
      </div>
    </div>
    <% @products.each_slice(4).each do |slice| %>
      <div class="row">
        <% slice.each do |product| %>
          <div class="col-md-3 portfolio-item">
            <p class="price">RM <%= product.price_cents/100 %></p>
            <a href="<%= product_path product %>"><img src="<%= product.user.store_setting.store_image.store_img.small%>" class="img-circle user-thumb" width="52"/></a>
            <a href="<%= product_path product %>"><img class="img-responsive" src="<%= product.product_attachments.first.attachment.small.url%>" width="262" alt=""></a>
            <h4>
              <a href="<%= product_path product %>"><%= product.name %></a>
            </h4>
            <a href="<%= product_path product %>">
              <p><%= product.city%>, <%= product.country%></p>
            </a>
          </div>
        <% end %>
      </div>
   <% end %>
  </div>
</section>