动态 bootstrap 个标签 rails

Question

我正在尝试让 rails 生成引用用户注册组的动态导航选项卡。基本上，我想要实现的是动态地让选项卡以用户注册的组命名（工作正常），然后通过单击其选项卡显示每个组的内容（由于某种原因无法正常工作）。该页面正确加载数据，但无法在选项卡之间切换

这是视图中的代码

<div class="tabbable tabs-left">
  <div class="row">
    <div class="col-md-4">
      <ul class="nav nav-pills nav-stacked">
        <% current_user.group.each do |group| %>
            <li><a href="#<%= group.name %>" data-toggle="tab">
            <%=group.name %></a></li>
        <% end %>
      </ul>
    </div>
    <div class="col-md-8">
      <div class="tab-content">
        <% current_user.group.each do |group| %>
            <div class="tab-pane fade <%= 'in active' if current_user.group.first == group %>" id="<%=group.name%>">
              <% if current_user.group_feed(group.id).any? %>
                  <ol class="microposts">
                    <%= render current_user.group_feed(group.id) %>
                    <%= group.name %>
                  </ol>
              <% end %>
            </div>
        <% end %>
      </div>
    </div>
  </div>
</div>

有什么我想念的吗？

Answer 1

问题是 group.name 生成了无效的 html id 属性。

html ID 不应该以数字开头（其他任何地方的数字都可以），并且没有空格。示例：

无效：

1foo aaa b

有效：

foo1 aaa-b

group.name.parameterize 将删除任何奇怪的字符（@£$ 等）并用 "-" 替换空格，因此请使用它。

您还希望使它独一无二，因为具有以下名称的事物："foo" 和 "foo!" 将 parameterize 成为同一事物："foo".

我会选择：

id="<%=(group.name.gsub(/[0-9]+/, "")+group.id.to_s).parameterize%>"

此代码从名称中删除任何数字（它只真正适用于 ID 的开头）然后在末尾添加 id 使其唯一。

动态 bootstrap 个标签 rails

dynamic bootstrap tabs with rails

tabs

ruby-on-rails

dynamic

twitter-bootstrap