Rails:Bootstrap手风琴没有崩溃

时间:2018-12-17 22:24:16

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

这是我的代码:

<div class="panel-group" id="accordion">
  <% @workspace_tasks.each do |t, a| %>
  <div class="panel panel-default">
    <div class="panel-heading">
      <h4 class="panel-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapse<%= t.to_s %>">
            <%= t %>
         </a>
      </h4>
    </div>

    <div id="collapse<%= t.to_s %>" class="panel-collapse">
      <div class="panel-body">  
          <table class="table table-striped">
          </table>
      </div>
    </div>
  </div>
 <% end %>
</div> 

如您所见,我将面板的ID设置为与我要遍历的哈希的键一致。

信息正确显示,但是,如果我默认将面板设置为展开,则无法折叠它。反之亦然,如果我默认设置为折叠,则无法展开面板。

我在我的应用程序中的其他地方使用了相同的代码,但是使用了不同的Model在Controller中创建哈希。我觉得这种行为很奇怪。

我不确定这是否是我的代码?还是Bootstrap的东西?

1 个答案:

答案 0 :(得分:0)

:help using-<Plug>指出id不能包含空格:

  

在HTML元素上指定时,id属性值在元素树中的所有ID中必须是唯一的,并且必须至少包含一个字符。 该值不得包含任何空格字符。

您需要准备t变量作为有效ID,例如通过用-替换空格:

t.to_s.gsub(/\s/, '-')

或使用The HTML5 specifcation

t.to_s.parameterize