Rails - コントローラから選択した要素を部分的に挿入する

Question

（非常に新しいレールとブートストラップ）私はhtmlのアコーディオンに要素を挿入するプロジェクトに取り組んでいます。要素のうち3つだけ折りたたむことができます。私はレイアウトを読んで、Railsのドキュメントの一部をレンダリングしましたが、特に、折りたたみ可能なクラスを3つの要素に割り当てる必要があるという点では、どうやってそれを行うのかは非常に混乱しています。どんなアドバイスも役に立ちます。事前に感謝します。

x.HTML.erb

<h4> 
    <a href="#"> 
     <li><%= link_to category.name, catalogo_path(cat_id: category.id), remote: true %></li> 
    </a> 
</h4> 


<% category.subcategories.each do |cat| %> 
    <li><%= link_to cat.name, catalogo_path(cat_id: cat.id), remote: true %></li> 

<% end %> 

部分

<h4> 
    <a href="#"> 
     <li><%= link_to category.name, catalogo_path(cat_id: category.id), remote: true %></li> 
    </a> 
</h4> 
<% category.subcategories.each do |cat| %> 
    <li><%= link_to cat.name, catalogo_path(cat_id: cat.id), remote: true %></li> 
<% end %> 

私が使用したいHTMLのアコーディオン構造：

<div class="accordion" id="accordion2"> 
       <div class="accordion-group"> 
        <h4> 
         <a href="#">Angulos</a> 
        </h4> 
        <h4>  
         <a href="#">Soleras</a> 
        </h4> 
        <h4> 
         <a href="#">Semiflechas</a> 
        </h4> 
        <h4> 
         <a href="#">Redondos</a> 
        </h4> 
        <div class="accordion-heading"> 
         <h4> 
          <a class="accordion-toggle" data-toggle="collapse" href="#collapseOne">Cuadrados</a> 
         </h4> 
        </div> 
        <div id="collapseOne" class="accordion-body collapse in"> 
         <a href="#" class="accordion-inner">Cuadrados Normales</a> 
         <a href="#" class="accordion-inner">Cuadrados Retorcidos</a> 
        </div> 
        <h4> 
         <a href="#">Canal</a> 
        </h4> 
        <h4> 
         <a href="#">Vigas IPR</a> 
        </h4> 
        <h4> 
         <a href="#">Vigas IPS</a> 
        </h4> 
       </div> 
       <div class="accordion-group"> 
        <div class="accordion-heading"> 
         <h4> 
          <a class="accordion-toggle" data-toggle="collapse" href="#collapseTwo">Placas</a> 
         </h4> 
        </div> 
        <div id="collapseTwo" class="accordion-body collapse"> 
         <a href="#" class="accordion-inner">Placa de Rollo</a><br> 
         <a href="#" class="accordion-inner">Placa de Grado</a> 
        </div> 
       </div> 
       <div class="accordion-group"> 
        <div class="accordion-heading"> 
         <h4> 
          <a class="accordion-toggle" data-toggle="collapse" href="#collapseThree">Laminas</a> 
         </h4> 
        </div> 
        <div id="collapseThree" class="accordion-body collapse"> 
         <a href="#" class="accordion-inner">Laminas Calientes</a><br> 
         <a href="#" class="accordion-inner">Laminas Frias</a> 
         <a href="#" class="accordion-inner">Laminas Antiderrapantes</a> 
        </div> 
       </div> 
      </div> 

Answer 1

あなたの質問を正しく理解していれば、あなたが投稿したHTMLを生成するためにパーシャルを使いたいと思う。ここに提案があります。

折りたたみ可能にする各セットの周りに.accordion-groupが必要と思わないです。すべてを1つにまとめることができます。

ここには、最も外側のERBテンプレートがあります。

<div class="accordion" id="accordion2"> 
    <div class="accordion-group"> 
    <%= @categories.each do |category| %> 
     <% if category.subcategories.any? %> 
     <%= render partial: "category_with_sub", locals: {category: category} %> 
     <% else %> 
     <%= render partial: "category", locals: {category: category} %> 
     <% end %> 
    <% end %> 
    </div> 
</div> 

部分_category_with_sub.html.erb

<div class="accordion-heading"> 
    <h4> 
    <a href="#"> 
     <li><%= link_to category.name, catalogo_path(cat_id: category.id), class: "accordion-toggle", "data-toggle" => "collapse", remote: true %></li> 
    </a> 
    </h4> 
</div> 

<div id="collapseOne" class="accordion-body collapse in"> 
    <% category.subcategories.each do |cat| %> 
    <li><%= link_to cat.name, catalogo_path(cat_id: cat.id), class: "accordion-inner", remote: true %></li> 
    <% end %> 
</div> 

部分_category.html.erb

<h4> 
    <a href="#"> 
    <li><%= link_to category.name, catalogo_path(cat_id: category.id), remote: true %></li> 
    </a> 
</h4> 

最後にひとつの提案。古いバージョンのブートストラップを使用しているようです。 the latest versionにアップグレードすることを検討してください。

UPDATE

あなたのコントローラは次のようになりますと仮定@categories

するカテゴリを編集。

class CategoriesController < ApplicationController 
    def index # or whatever action you want 
    @categories = Category.all # or whatever query you want to use 
    end 
end