Bootstrap Accordion崩溃与Ruby哈希

时间:2016-08-15 16:00:02

标签: ruby-on-rails ruby twitter-bootstrap erb

折叠仅适用于第一个按钮,我知道这是因为只为所有按钮设置了第一个div id。在使用hash.each时,如何为每个元素迭代并创建新的div id?

这是我的错误:

<% @contacts.each do |category, hash| %>
<div class="panel-group" id=accordion">
 <div class="panel panel-default">
   <div class="panel-heading">
   <h3 class="panel-title"><%= category %></h3>
   </div>
 <div class="panel-body">
 <ul class="list-group">
  <% hash.each do |contact| %>
    <li class="list-group-item" style="border: none">
    <button type="button" class="btn btn-info" data-toggle="collapse" data-parent="#accordion" data-target="#demo"><%= contact['name'] %></button>
    <div id="demo" class="panel-collapse collapse">
        <div class="panel-body"><%= contact['email'] %></br><%= contact['ext'] %>
        </div>
    </div>
   </li>
<% end %>
   </ul>
  </div>
 </div>
</div>
<% end %>

这是我的.rb中的相应代码:

get '/contact' do
contact = Contacts.new
@contacts = contact.getContacts
@contacts.each { |s| puts "get /contact found contact #{s.last.first['name']}" }
erb :contact

1 个答案:

答案 0 :(得分:0)

<% hash.each_with_index do |contact, index| %>
    <li class="list-group-item" style="border: none">
    <button type="button" class="btn btn-info" data-toggle="collapse" data-parent="#accordion" data-target="#collapse<%= index %>"><%= contact['name'] %></button>
    <div id="collapse<%= index %>" class="panel-collapse collapse">
        <div class="panel-body"><%= contact['email'] %></br><%= contact['ext'] %>
        </div>
    </div>
   </li>
<% end %>