Sweetalert: Deuxième swal non exécuté

Créé le 15 janv. 2015  ·  19Commentaires  ·  Source: t4t5/sweetalert

Bonjour,

J'ai cet appel doux:

var self = this; 

swal({
      title              : $.t('modal.clear.title') || "Etes vous sûr ?",
      text               : $.t('modal.clear.text') || "Le formulaire sera définitivement perdu !",
      type               : "warning",
      showCancelButton   : true,
      confirmButtonColor : "#DD6B55",
      confirmButtonText  : $.t('modal.clear.yes') || "Oui, supprimer",
      cancelButtonText   : $.t('modal.clear.no') || "Annuler",
      closeOnCancel      : true
}, function(isConfirm) {
   if (isConfirm){
       // I Use backbone radio event
       self.homePageChannel.trigger('deleteForm', self.currentSelectedForm)
   }
});

Dans le rappel, j'envoie un événement avec la radio backbone.
À ce stade, tout va bien.

Et dans ma réponse à l'événement, je veux afficher une autre alerte douce comme celle-ci:

formDeleted : function(result) {
        swal({
            title : $.t('modal.deleted.title') || 'Formulaire supprimé !',
            text  : $.t('modal.deleted.text') || 'Votre formulaire a été supprimé avec succès',
            type  : "success",
        });
  },

Et la deuxième douce alerte n'apparaît pas.
Et je suis sûr que la fonction formDeleted est exécutée.

Merci de votre aide

bug

Commentaire le plus utile

au cas où cela aide n'importe qui. Dans mon cas, j'ai pu régler ce problème en définissant closeOnCancel et / ou closeOnConfirm sur false . Empêchant ainsi la fermeture de la deuxième boîte d'alerte. Le deuxième appel swal peut les mettre à true .

Tous les 19 commentaires

Pourriez-vous essayer de nous montrer votre code dans un JSFiddle?

J'ai créé un JSFiddle: http://jsfiddle.net/5pj7wwx9/

Lorsque je clique sur le bouton, le premier sweetAlert s'affiche, le callback est appelé mais le second sweetAlert no.

Vous verrez dans le JSFiddle que j'ai essayé avec un setTimeout, cela fonctionne après 2 secondes

J'ai ce même problème. Disposé à fournir toutes les informations nécessaires pour trier cela.

+1 à la résolution requise pour le problème

au cas où cela aide n'importe qui. Dans mon cas, j'ai pu régler ce problème en définissant closeOnCancel et / ou closeOnConfirm sur false . Empêchant ainsi la fermeture de la deuxième boîte d'alerte. Le deuxième appel swal peut les mettre à true .

Ce n'est pas un comportement correct, nous ne devrions pas dépendre de la valeur de closeOnCancel et closeOnConfirm.

Je suis d'accord, mais c'est peut-être le but de closeOnConfirm puisque c'est aussi ainsi que cela est décrit dans les exemples swal qui ouvrent une deuxième boîte (http://tristanedwards.me/sweetalert)
Je suis toujours d'accord que ce n'est certainement pas intuitif.

pour moi même cela ne fonctionne pas. Vous pouvez jeter un œil au violon que j'ai créé. https://jsfiddle.net/madhureng/5pj7wwx9/16/

Je serai plus qu'heureux que cela soit corrigé plutôt que l'API prenne une décision à ma place.

@ maddy2308 - vous avez trop de clics en cours. Ça marche.
Découvrez ce violon: https://jsfiddle.net/g8j1acv4/

La seule chose que j'ai modifiée a été de retirer votre premier document.cliquez et de le changer en document.ready.

Comme le souligne @joenorton , c'est à cela que sert closeOnConfirm: false . Je suis d'accord que c'est un peu peu intuitif, donc si quelqu'un a une solution au problème, je serais heureux de l'ajouter!

@ maddy2308 , le problème avec votre violon est que $('button') est trop ambigu, donc les boutons de swal sont également invoqués. Si vous le modifiez aussi $('body > button') cela devrait fonctionner.

J'ai également souffert de ce problème et je pense que cela doit être changé.

@ t4t5 Sans regarder le code source, nous pouvons supposer ce qui suit:

the first swal is shown at point A in time
the user interacts with the first swal at point B in time
the callback is called and invokes the second swal at point C in time
the active swal is dismissed at point D in time

Une solution simple pour résoudre ce problème serait la suivante:

<strong i="11">@A</strong>: An integer variable is set that increases with every call to swal
<strong i="12">@B</strong>: The current value of the variable is remembered
<strong i="13">@D</strong>: If the variable has changed, do not call swal.close

Cela permettra à C d'appeler n'importe quelle quantité de nouvelles boîtes de dialogue, avec très peu de modifications nécessaires à la base de code actuelle.

J'ai eu le même problème, je l'ai résolu en ajoutant un $ timeout sur l'action de confirmation (avec Angular)
if (isConfirm){ return $timeout(function() { // I Use backbone radio event self.homePageChannel.trigger('deleteForm', self.currentSelectedForm) }, 100); }

Ce bug se produit également avec moi dans la situation suivante:

  1. Appelez une alerte de confirmation qui déclenche une requête $http sur angulaire
  2. Forcer l'échec immédiat de la requête $http en définissant la limitation sur offline sur les outils de développement de Chrome .
  3. Appelez une alerte d'erreur en cas d'échec $http .

La première alerte de confirmation s'affichera correctement, mais l'alerte d'erreur ne s'affichera pas.

Remarque: je n'ai pas plongé dans le code, mais il semble que l'animation de fermeture sur toute alerte douce existante devrait être annulée et elle devrait être immédiatement détruite, puis la deuxième alerte s'affichera correctement.


Edit: Comme je m'y attendais, le problème vient de la première douce confirmation d'alerte. Définir animation sur false lors du premier swal arrête le problème. Mais cela ressemble à un BUG pour moi, car je pourrais vouloir que l'animation soit activée au cas où l'erreur ne se produirait pas.

Je propose deux solutions:

1er: Si une deuxième alerte est appelée alors qu'une alerte existante est en cours d'animation, arrêtez le processus d'animation, fermez immédiatement l'alerte actuelle et affichez la nouvelle.

2ème: Mettez en file d'attente la deuxième alerte à ouvrir lorsque l'animation de fermeture est terminée.

La 2ème solution devrait rendre les choses plus fluides, tandis que la 1ère solution fait que l'erreur modale apparaît plus rapidement!

J'essaierai de faire une pull request, mais je n'ai jamais contribué à ce projet auparavant, si quelqu'un sait où corriger, n'hésitez pas à faire la pull request en premier! :)

@ t4t5 Veuillez jeter un œil sur mon rapport et mes solutions, si vous approuvez je peux faire le correctif!

Vous pouvez utiliser querySelectorAll , il renvoie tous les éléments, vous pouvez donc boucler sur les valeurs renvoyées

var alertBtn = document.querySelectorAll('.js-alert');

for (var i = 0; i < alertBtn.length; i++) {
    alertBtn[i].onclick = function(){
        swal({
            title: "text",
            text: "text text"
            });
    };
}

J'ai eu le même problème avec mon SweetAlert, quand le deuxième swal devrait apparaître, ils ne le font pas, je reçois juste une erreur dans ma console, résolue en incluant un $ timeout dans ma fonction.

function(error) { console.log(error); $timeout(function(){ SweetAlert.error('Erro'); },100) }

J'ai eu le même problème mais la solution de @PommeVerte l'a résolu. J'avais besoin de définir closeOnCancel: false sur le swal parent ().

Depuis SweetAlert 2.0, closeOnConfirm et closeOnCancel ne sont plus nécessaires pour enchaîner les SweetAlerts. Utilisez simplement des promesses ! :)

SetTimeout peut résoudre le problème après le rappel, mais j'aimerais en savoir plus sur la cause du problème.

Cette page vous a été utile?
0 / 5 - 0 notes

Questions connexes

yrshaikh picture yrshaikh  ·  4Commentaires

mouro001 picture mouro001  ·  3Commentaires

Untit1ed picture Untit1ed  ·  5Commentaires

vmitchell85 picture vmitchell85  ·  6Commentaires

AlexV525 picture AlexV525  ·  4Commentaires