Question

更新：对于将来遇到此问题的任何人。我使用了来自http://code.stephenmorley.org/javascript/collapsible-lists/的CollapsibleList。它就像一个魅力！只需将其包含在app / assets / javascripts文件夹中，然后将其添加到带有列表的.html.erb中，并按照指示从链接中引用类。

我有一个带有任务，任务和子任务的Rails 4应用程序。每个任务都有许多任务。每个任务都有很多任务。每个任务都有许多子任务，但子任务只能有一个任务。在任务索引页面上，我使用嵌套列表动态创建树状结构。目前，它看起来像：

     <% @missions.each do |mission| %>

         <li data-toggle="collapse" data-target="list">

            <%=  mission.id %>| <%= mission.name %> | <%= link_to mission.description, mission %>

                   <% if !mission.tasks.empty? %>           

                       <div id="list" class="collapse">

                         <ul><% mission.tasks.each do |task| %>

                           <li><%=  link_to task.name,task %>                   
                  <% if !task.sub_tasks.empty? %>

                                <ul>

                    <% task.sub_tasks.each do |sub_task| %>

                    <li><%= sub_task.name %></li>

                            <% end %>

                </ul>

               </li>

            <% end %>

            <%end%>
           </ul> 
            </div>
     <%end%>
       </li> 
 <% end %>
</ul>
</div>

这给了我想要的基本结构。我添加了以下脚本：

<script>
$('#data-toggle').collapse();
</script>

一旦单击列表项，它就会使列表项折叠。但是，它仅适用于列表的第一个元素。我想我只是想知道有没有办法在每个列表项上使用折叠功能。

我试图使用祖先和jstree宝石。但是，我找不到将这些应用到现有rails应用程序的示例。任何帮助将不胜感激。

Answer 1

更新：对于将来遇到此问题的任何人。我使用了来自"The Absolute Minimum Every Software Developer Absolutely, Positively Must Know About Unicode and Character Sets (No Excuses!)"的CollapsibleList。它就像一个魅力！只需将其包含在app / assets / javascripts文件夹中，然后使用列表添加到.html.erb

<script src="CollapsibleList.js"></script>

并按照链接中引用类的说明进行操作。

Rails 4应用程序中的动态可折叠列表

1 个答案: