Rails - 从控制器中部分插入 select 个元素
Rails - Inserting select elements from controller in partial
(rails 和 bootstrap 的新手)我正在做一个项目,我想在其中将元素插入 html 手风琴中,准确地说是 10 个元素。只有 3 个元素是可折叠的。我已经阅读了 Rails 文档的布局和渲染部分,但我仍然很困惑如何去做,尤其是必须将可折叠的 class 分配给仅 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>
如果我对你的问题的理解正确,那么你想使用 partials 来生成你发布的 HTML。这是一个建议。
我认为您不需要 .accordion-group
围绕每个要折叠的集合。你可以把所有东西都放在一个里面。
这是最外面的 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>
最后一个建议。看起来您使用的是 bootstrap 的旧版本。您可能需要考虑升级到 the latest version.
更新
将类别编辑为@categories
假设您的控制器看起来像这样。
class CategoriesController < ApplicationController
def index # or whatever action you want
@categories = Category.all # or whatever query you want to use
end
end
(rails 和 bootstrap 的新手)我正在做一个项目,我想在其中将元素插入 html 手风琴中,准确地说是 10 个元素。只有 3 个元素是可折叠的。我已经阅读了 Rails 文档的布局和渲染部分,但我仍然很困惑如何去做,尤其是必须将可折叠的 class 分配给仅 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>
如果我对你的问题的理解正确,那么你想使用 partials 来生成你发布的 HTML。这是一个建议。
我认为您不需要 .accordion-group
围绕每个要折叠的集合。你可以把所有东西都放在一个里面。
这是最外面的 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>
最后一个建议。看起来您使用的是 bootstrap 的旧版本。您可能需要考虑升级到 the latest version.
更新
将类别编辑为@categories
假设您的控制器看起来像这样。
class CategoriesController < ApplicationController
def index # or whatever action you want
@categories = Category.all # or whatever query you want to use
end
end