title: Rails nested form and bootstrap tabs
body: <p>I have a nested model (<code>exptype</code>), and I'm using bootstrap tabs to show the <code>has_many</code> relationship between the parent (<code>experiment</code>) and it's children (<code>exptype</code>).</p>
  
  <p>So far my code looks like:</p>
  
  <pre><code> &lt;div role="tabpanel"&gt;
        &lt;!-- Nav tabs --&gt;
        &lt;ul class="nav nav-tabs" role="tablist"&gt;
          &lt;% @experiment.exptypes.each do |e| %&gt;
            &lt;li role="presentation"&gt;&lt;a href="#exptype&lt;%=e.id%&gt;" aria-controls="exptype&lt;%=e.id%&gt;" role="tab" data-toggle="tab"&gt;&lt;%=e.get_name%&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;% end %&gt;
        &lt;/ul&gt;
  
        &lt;!-- Tab panes --&gt;
        &lt;div class="tab-content"&gt;
          &lt;%= f.fields_for :exptypes do |builder| %&gt;
            &lt;div role="tabpanel" class="tab-pane" id="exptype&lt;%=builder.object.id%&gt;"&gt;
              &lt;%=builder.object.id%&gt;
            &lt;/div&gt;
          &lt;% end %&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>The tabs themselves work. But the <code>tab-content</code> does not. What happens is for each tab, all the <code>builder.object.id</code>'s are shown in <strong>each</strong> tab, and not in their respective ones.</p>
  
  <p>I believe it's the <code>fields_for</code> loop that is causing the problem. However, I want to be able to have a tab that allows for the addition of a new <code>exptype</code>. </p>