comment détruire complètement la fenêtre modale de bootstrap ?

Question

J'ai fait usage de fenêtre modale pour une mise en œuvre de l'assistant qui comporte environ 4,5 étapes. J'ai besoin de le détruire complètement après l'étape dernière étape (surFinish) et Étape OnCancel sans rafraîchissement de la page . Je peux bien sûr la masquer, mais le fait de cacher la fenêtre modale rétablit tout tel quel lorsque je l'ouvre à nouveau. Quelqu'un peut-il m'aider à résoudre ce problème ?

Merci Toutes les réponses aux questions sont utiles pour moi.

Answer 1

Cela a fonctionné pour moi sur BS4 :

let $modal = $(this);
$modal.modal('hide').on("hidden.bs.modal", function (){
    $modal.remove();
});

nous retirons la modale après qu'elle soit complètement cachée. de la doc BS :

hidden.bs.modal : Cet événement est déclenché lorsque la modale a fini d'être cachée à l'utilisateur (attendra le truquage CSS). cachée à l'utilisateur (attendra que les transitions CSS soient terminées).

Answer 2

Si l'ombre de la modale reste plus sombre et que l'on ne veut pas afficher plus d'une modale, cela sera utile.

$('.modal').live('hide',function(){
    if($('.modal-backdrop').length>1){
        $('.modal-backdrop')[0].remove();
    }
});

Answer 3

J'ai dû utiliser la même modale pour différents clics de liens. J'ai juste remplacé le contenu html par le vide "" de la modale dans le callback caché.

Answer 4

J'ai un carrousel dans une modale et j'essaie de le "réinitialiser" lorsque l'utilisateur clique sur le bouton de renvoi.

Dans le carrousel, l'utilisateur effectuera quelques actions de clic qui modifieront les images du carrousel. La fonctionnalité que j'essaie d'obtenir est la suivante : lorsque l'utilisateur clique sur le bouton de rejet puis sur le bouton de basculement du mode de présentation, tous les éléments originaux du carrousel sont restaurés et le carrousel commence à la première diapositive.

Je pensais qu'il suffirait d'utiliser les suggestions ci-dessus pour détruire complètement la modale et donc le carrousel, mais lorsque je renvoie la modale et la relance, elle continue sur la diapositive qu'elle affichait auparavant.

Je ne publierai pas de code ici, j'aimerais simplement avoir un avis sur la façon d'aborder ce problème.

Passez une bonne soirée.

Answer 5

Seul ceci a fonctionné pour moi

$('body').on('hidden.bs.modal', '.modal', function() {
    $('selector').val('');
});

Il est sûr de forcer les sélecteurs pour les rendre vides puisque la version de bootstrap et jquery peut être la raison de ce problème.