Javascript Girl
  1. Javascript Girl
  3. Bootstrap, les dialogues modaux, l'événement show.bs.modal ne déclenche pas
Intereting Posts
Performances IE6 avec expressions CSS Exécuter des scripts shell dans un script java ou déclencher un scanner depuis le navigateur Partagez un document Drive sans aviser l'utilisateur avec Google Apps Script Comment gérer ETIMEDOUT erreur? Comment désactiver les avertissements concernant «ceci» et le mode strict à l'aide de JSHint? Comment écrire une valeur de couleur RVB en JavaScript? JQuery: Index de l'élément dans le tableau où le prédicat Comment activer deux fonctions JavaScript en parallèle? Angularjs passant les valeurs des paramètres dans la fonction ng-click Afficher un nombre en format indien en utilisant Javascript Comment puis-je déterminer quels objets sont collectés par le collecteur d'ordures? Chaud et partagé Observable d'un EventEmitter Comment télécharger des fichiers de dropzone à cloudinary Cochez une zone de texte pour les caractères non valides à l'aide de js et des expressions régulières Avec javascript, comment obtenez-vous l'URL du résultat final après la redirection 302 sur img src?

Bootstrap, les dialogues modaux, l'événement show.bs.modal ne déclenche pas

J'utilise la boîte de dialogue modal avec une option à distance: 

<a target="profile-banner" data-target="#edit-slide-dlg" href="/Banner/SlideEditModal/1/1" data-toggle="modal" class="banner-slide-control">Edit</a>

Où: 

 <div id="edit-slide-dlg" class="modal fade" tabindex="-1"></div>

De plus, j'écoute pour l'événement show.bs.modal où j'utilise la propriété event.target: 

 $("body").on("shown.bs.modal", function (event) { // do something with event.target }

Certaines raisons pour lesquelles cet événement n'est pas déclenché lorsque j'ouvre la boîte de dialogue pour la première fois. Et il est renvoyé pour la deuxième fois seulement. J'ai essayé de parcourir les scripts bootstrap et trouvé ce code (voir mon commentaire): 

 var e = $.Event('shown.bs.modal', { relatedTarget: _relatedTarget }) transition ? that.$element.find('.modal-dialog') // wait for modal to slide in .one($.support.transition.end, function () { that.$element.focus().trigger(e) //THIS LINE NEVER EXECUTED AT FIRST DIALOG OPENING }) .emulateTransitionEnd(300) : that.$element.focus().trigger(e)

Donc, j'ai désactivé la transition en tant que solution de contournement. L'événement a été déclenché pour la première fois mais, event.target est une chaîne vide. Pour la deuxième fois, event.target contient un dialogue HTML approprié. Est ce problème avec mon code ou bootstrap?

J'ai eu exactement le même problème. Je pourrais le réparer avec la solution à cette question StackOverflow: événement Bootstrap modal 'chargé' sur un fragment distant

Fondamentalement, vous devez ouvrir manuellement le mode et implémenter le chargement d'Ajax vous-même. Quelque chose comme: 

 $modal.modal({ 'show': true }).load('/Banner/SlideEditModal/1/1', function (e) { // this is executed when the content has loaded. });