bootstrap не привязан к динамически отображаемому html через erb

Question

Я работаю над Rails-приложением с Bootstrap. В одном из моих представлений я использую «вкладки»:

<ul class="nav nav-tabs" id="myTab" role="tablist"> 
    <li class="nav-item"> 
    <a class="nav-link active" data-toggle="tab" href="#home" role="tab" aria-controls="home">Home</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" data-toggle="tab" href="#profile" role="tab" aria-controls="profile">Profile</a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" data-toggle="tab" href="#messages" role="tab" aria-controls="messages">Messages</a> 
    </li> 

</ul> 

<div class="tab-content"> 
    <div class="tab-pane active" id="home"  role="tabpanel">...</div> 
    <div class="tab-pane"  id="profile" role="tabpanel">...</div> 
    <div class="tab-pane"  id="messages" role="tabpanel">...</div> 
</div> 

Это прекрасно работает, если его жестко закодированный HTML. Когда я динамически добавить дополнительный «LI» в «нав-лапок» пункта:

<% if @customer.profiles.present? %> 
<% @customer.profiles.each_with_index do |profile,index| %> 
    <li class="nav-item"> 
    <a class="nav-link" data-toggle="tab" href="#profile<%=index%>" role="tab"> profile-<%=index%> </a> 
    </li> 
<% end %> 
<% end %> 

и «ДИВ» в «вкладки-контента» как с уникальным номером:

<% if @customer.profiles.present? %> 
    <% @customer.profiles.each do |profile,index| %> 
     <div class="tab-pane" id="profile<%=index%>" role="tabpanel"> 
      <%= render :partial => 'profiles/homes_pane' , :locals => { :profile => profile} %> 
     </div> 
    <% end %> 
<% end %> 

добавлен в 'href' и 'id', вкладки больше не работают.

Похоже, что Bootstrap не привязывает javascript к динамически сгенерированным элементам HTML.

Я делаю что-то неправильно или мне нужно обходное решение. Любые предложения приветствуются.

наилучшими пожеланиями, Мартейн

Answer 1

Bootstrap не знает разницу между динамически, как это процесс на стороне клиента.

Похоже, что вы отсутствуете каждый_with_index в своем фрагменте содержимого вкладки.

Если вы используете инспектор элементов, я полагаю, вы увидите, что индекс для второй части отображается неправильно.