Rails 4 - 如何获得 <li> 单击以在另一个 <div> 中显示部分视图？

Posted 2023-02-26

【中文标题】Rails 4 - 如何获得 <li> 单击以在另一个 <div> 中显示部分视图？

【英文标题】：Rails 4 - how to get a <li> click to display a partial view in another <div>?

【发布时间】：2015-10-24 00:58:25

【问题描述】：

我有一个网站，我希望在页面顶部将类别显示为下拉按钮。单击按钮后，它将显示项目列表。 单击项目（<li> 元素）后，与其相关的其他项目应显示在其下方的 <div> 中。现在它以正确的结果显示，但在错误的位置......就在<li> 下方。 这是我用来显示部分的代码行：<li><%= d %> <span class="badge"><%= @c_id_obj.count %></span><%= link_to render(:partial => 'show', locals: item: @item_to_c) %></li> 我还需要在 locals 选项中声明的变量传递到局部视图中。 如何根据我选择的<li> 让部分显示在div#display 中？ 如果我将渲染代码放在div#display 中，那么它将无法获得正确的变量，因此它必须根据我选择的<li> 以某种方式使用正确的变量。

这是我到目前为止的代码.... index.html.erb：

<%= link_to items_path, class: 'btn btn-default btn-lg' do %>
   See all <span class="badge"><%= @items.count %></span>
<% end %>

<div class="btn-group" role="group">
    <button type="button" class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown">Food <span class="badge">
<%= @food.count %></span>&nbsp;<span class="caret"</span>
</button>
      <ul class="dropdown-menu">
        <% @food.each do |x| %>
        <% q = /#x/i %>
        <% @food_id = Array.new %>
        <% @food_id_obj = @items.any_of(:food => q).only(:id) %>
        <% @food_id_obj.each |i| @food_id << i._id  %>
        <% @item_to_food = @items.any_of(:_id.in => @food_id) %>
            <li><%= x %>&nbsp;<span class="badge"><%= @food_id_obj.count %></span><%= link_to render(:partial => 'show', locals: item: @item_to_food) %></li>

        <% end %>
     </ul>
</div>
<div class="btn-group" role="group">
<button type="button" class="btn btn-default btn-lg dropdown-toggle" data-toggle="dropdown">Clothing <span class="badge">
<%= @clothing.count %></span>&nbsp;<span class="caret"</span>
</button>
      <ul class="dropdown-menu">
        <% @clothing.each do |d| %>
        <% g = /#d/i %>
        <% @c_id = Array.new %>
        <% @c_id_obj = @items.any_of(:Clothing => g).only(:id) %>
        <% @c_id_obj.each |u| @dt_id << u._id  %>
        <% @item_to_c = @items.any_of(:_id.in => @c_id) %>
            <li><%= d %>&nbsp;<span class="badge"><%= @c_id_obj.count %></span><%= link_to render(:partial => 'show', locals: item: @item_to_c) %></li>
        <% end %>
     </ul>
</div>

<br/><br/>

<div class="pull right" id="display"></div>

_show.html.erb:

  <table class="table-hover table-bordered">
    <thead>
      <tr>
        <th>Food name</th>
        <th>Clothing name</th>

        <th colspan="3">Options</th>^M
      </tr>
    </thead>

    <tbody>
      <% item.each do |i| %>
        <tr>
        <td><%= i.food %></td>
        <td><% i.clothing.each do |u| %>
           <ul>
             <li><%= u %></li>
           </ul>
           <% end %>
        </td>

【参考方案1】：

最终不得不在控制器中创建一个调用 javascript 文件的方法，而这个 javascript 称为 parital。必须通过rails路径传递变量。以此作为参考：

https://coderwall.com/p/kqb3xq/rails-4-how-to-partials-ajax-dead-easy