Bootstrap est à Distance de Dialogue Modale ne fonctionne Pas
Je vais avoir des problèmes à distance à l'aide de boîtes de dialogue modales à partir de l'api de Twitter Bootstrap.
Je suis en train de charger une boîte de dialogue modale avec le contenu d'une page html distante. J'ai deux pages, l'une contenant le bouton (modal-remote.html) et un contenant le contenu que je souhaite afficher lorsque le bouton est cliqué (modal-target.html).
modal-remote.html:
<!DOCTYPE html>
<html lang="en">
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<script src="bootstrap/js/jquery.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<a href="modal-target.html" data-target="#myModal" role="button" class="btn" data-toggle="modal">
Launch demo modal</a>
</html>
Voici mon code pour la cible (ou à distance) page
modal-target.html:
<html>
<link href="bootstrap/css/bootstrap.css" rel="stylesheet">
<link href="bootstrap/css/bootstrap-responsive.css" rel="stylesheet">
<script src="bootstrap/js/jquery.js"></script>
<script src="bootstrap/js/bootstrap.js"></script>
<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
<p>The quick brown fox jumps over the lazy dog. </p>
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary" id="save_btn">Save changes</button>
</div>
</div>
</html>
Ils sont dans le même répertoire. Quand je clique sur le bouton, rien ne se passe. Quelqu'un sait ce que je fais mal? Non éloignées des boîtes de dialogue modales fonctionnent parfaitement, j'ai juste ne peut pas comprendre comment utiliser la fonction télécommande.
OriginalL'auteur Blake | 2012-10-19
Vous devez vous connecter pour publier un commentaire.
Vous devez lire attentivement les modale de la documentation.
Vos fichiers devraient être plus comme ça :
modal-remote.html:
modal-target.html:
Remarque maintenant avec bootstrap3, le contenu sera injecté dans la racine de l'élément modal. Voir stackoverflow.com/a/18387625/553073 et document
OriginalL'auteur Sherbrow
À partir de Bootstrap v3.30, distance option est obsolète. Voir Ici.
Donc recommandé de l'utiliser à distance le contenu est d'utiliser le jquery.load() méthode.
Exemple:
OriginalL'auteur Chvoirre00