Comment ouvrir un fichier d'amorce modal avec un onglet spécifique active
Je suis en train d'avoir l'onglet dans le bootstrap modal ouvert en fonction de ce lien est cliqué. Peu importe ce que j'ai essayé il ne s'ouvre que sur le premier onglet. Les deux liens sont les suivants:
<a href="#tab-mileage" data-toggle="modal" data-target="#buyers-report-modal" >Mileage</a>
<a href="#tab-wrong-vehicle" data-toggle="modal" data-target="#buyers-report-modal">Wrong vehicle?</a>
et le balisage pour le modal est ici:
<div class="modal" id="buyers-report-modal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog modal-lg modal-offset-top">
<div class="modal-content">
<div class="modal-body">
<div class="sd-tabs sd-tab-interaction">
<div class="row">
<ul class="nav nav-tabs col-md-3 custom-bullet">
<li class="active"><a data-toggle="tab" href="#tab-wrong-vehicle"> Wrong Vehicle?</a></li>
<li><a data-toggle="tab" href="#tab-mileage"> Mileage</a></li>
</ul>
<div class="tab-content col-md-9">
<form id="tab-wrong-vehicle" class="tab-pane active" action="" method="post"> <!-- Wrong Vehicle? -->
<h3 class="tab-title">Tab 1</h3>
</form> <!-- Wrong Vehicle? -->
<form id="tab-mileage" class="tab-pane"> <!-- Mileage -->
<h2 class="tab-title-resp hidden-md hidden-lg"> Mileage</h2>
<h3 class="tab-title">Tab 2</h3>
</form> <!-- Mileage -->
</div>
</div>
</div>
</div>
</div>
J'ai besoin de la modale de s'ouvrir sur le lien est cliqué, par exemple,si vous cliquez sur le deuxième lien, il permettrait d'ouvrir le deuxième onglet de la feuille modale. Toute aide serait grandement appréciée, je n'ai pas été en mesure de trouver une solution à ce n'importe où.
J'ai quitté l'origine de l'ID dans le code au cas ou j'ai fait une erreur en les remplaçant.
OriginalL'auteur ConorJohn | 2015-10-12
Vous devez vous connecter pour publier un commentaire.
J'ai ajouté une classe
.modal-toggle
à la<a>
éléments qui bascule les auxiliaires modaux. De plus, j'ai ajouté quelques fonctions supplémentaires qui déclenche sur clic et d'obtenir de lahref
de l'élément cliqué, après que je suis en utilisanttab("show")
sur le<a>
élément à l'intérieur de la<li>
qui correspond à lahref
. (J'ai ajouté un bouton de fermeture à l'intérieur de votre modal, de sorte qu'il est plus facile de tester la démo)Démo De Violon
Vous êtes les bienvenus! 🙂
OriginalL'auteur Ramiz Wachtler
Prendre l'avantage de la
shown.bs.modal
événement. L'événement est titulaire d'infos sur lehref
de l'cliqué<a>
, et vous pouvez alors changer l'onglet selon que :votre code de travail -> http://jsfiddle.net/pvo1sny8/
C'est le Bootstrap façon de le faire.
OriginalL'auteur davidkonrad
Vous devez cibler l'onglet d'ancrage et d'exécuter le
$.tab('show')
fonction.http://getbootstrap.com/javascript/#tabs
Puisque vous connaissez l'onglet d'ancrage a les attributs de data-toggle=tab href=id on peut utiliser un href du lien à passer le sélecteur de la languette.
DÉMO:
http://jsfiddle.net/SeanWessell/2ct9zuu9/
OriginalL'auteur Sean Wessell