Twitter Les onglets Bootstrap ne fonctionnent pas dans un modal

Question

Dans une application rails, je charge le contenu d'une fenêtre modale (bootstrap modal) via Ajax. Cela fonctionne bien.

Ce contenu contient des onglets (onglets d'amorçage). Les onglets sont affichés correctement, je peux cliquer sur les onglets et l'onglet actif va changer correctement ... mais le contenu ne changera pas.

<div id="negotiation-details"> 
    <div id="negotiation-overview"></div> 

    <ul id="nego-tabs-menu" class="tabs"> 
    <li class="active"><a href="#nego-figures">Figures</a></li> 
    <li><a href="#nego-dates">Dates</a></li> 
    <li><a href="#nego-characteristics">Characteristics</a></li> 
    </ul> 
    <div id="my-tab-content" class="tab-content"> 
    <div id="nego-figures" class="tab-pane active">figures content</div> 
    <div id="nego-dates" class="tab-pane">dates content</div> 
    <div id="nego-characteristics" class="tab-pane">characteristics content</div> 
    </div> 
</div> 

Avez-vous une idée? peut-il être provoqué par le fait que les onglets sont chargés après DOM? Si oui, comment puis-je les activer à nouveau?

Answer 1

Erreur stupide. Il s'est avéré que j'avais une deuxième fenêtre modale rendue.

Mon javascript a mis à jour le contenu du modal en fonction du nom de la classe. En ciblant le modal avec le bon ID fixe les choses.

$('#modal-window .modal-body') 

au lieu de

$('.modal-body') 

Answer 2

J'ai testé votre code et cela a fonctionné après avoir ajouté une

"data-toggle"=>"tab" 

à chacun des éléments de menu onglets, comme ceci:

#negotiation-details 
    #negotiation-overview 
    %ul#nego-tabs-menu.tabs 
    %li.active 
     %a{:href => "#nego-figures","data-toggle"=>"tab"} Figures 
    %li 
     %a{:href => "#nego-dates","data-toggle"=>"tab"} Dates 
    %li 
     %a{:href => "#nego-characteristics","data-toggle"=>"tab"} Characteristics 
    #my-tab-content.tab-content 
    #nego-figures.tab-pane.active figures content 
    #nego-dates.tab-pane dates content 
    #nego-characteristics.tab-pane characteristics content 

Ps. Désolé pour la syntaxe haml.