How to listen for when sweet alert closes

Question

I am currently working with sweetalert2 and I am trying to detect when the alert closes. However the DeleteUnsavedImages function is not firing. I thought that assigning the function to the onclose key would work but no luck.

   swal({
       html: data,
       showCloseButton: false,
       showCancelButton: false,
       width: 800,
       showConfirmButton: false,
       onClose: DeleteUnsavedImages()
   }).then(function () {

   });


function DeleteUnsavedImages(){
    var test = "-1";
}

Any help would be appreciated :-)

oh, @BoyWithSilverWings has given the solution in comments. Cool... — Himanshu Upadhyay, Oct 09 '17 at 05:52

Himanshu Upadhyay · Accepted Answer · 2017-10-09T05:59:57.800

16

I tested with my sweet alert to confirm the issue, you just need to pass the function name without () and the function will be called inside onClose event handler of swal. Its called passing a reference of the function to call when onClose gets fired of swal.

Make a little change like this:

   swal({
       html: data,
       showCloseButton: false,
       showCancelButton: false,
       width: 800,
       showConfirmButton: false,
       onClose: DeleteUnsavedImages        // Removed () from here
   }).then(function () {

   });


   function DeleteUnsavedImages(){
       var test = "-1";
   }

edited Oct 09 '17 at 05:59

answered Oct 09 '17 at 05:51

Himanshu Upadhyay

6,220
1
13
32

You're not calling the function `DeleteUnsavedImages`. You're providing a reference to a function, which is then called when the alert closes. – fubar Oct 09 '17 at 05:56
yes, Its called passing a reference of the function to call when `onClose` gets fired of swal. – Himanshu Upadhyay Oct 09 '17 at 05:57
Yes, I know. But your answer says: _you just need to call the function without `()`_, which is incorrect. You're not calling the function. You're passing a reference to a function. – fubar Oct 09 '17 at 05:58
Going to update my comment in answer so it will make the concept clear. Thanks for mentioning it @fubar. – Himanshu Upadhyay Oct 09 '17 at 05:58
wouldn't be enough to use the "then(..)" statement instead of the onClose property? – javier_domenech Sep 24 '18 at 13:35
@vivoconunxino `.then()` won't run on modal close. – Alexander Kim Oct 01 '18 at 05:27
I had a problem with IE11 and Swal2 (IE11 showed syntax error in console). The reason was ,that IE11 DON'T support =>. I had: onClose: () => (window.history.back()) in code and for IE11 support had to create a function function BrowserBack() { history.back(1); } and change the code to: onClose: BrowserBack (hope this helps somebody. – FredyWenger Jan 07 '20 at 14:39

score 3 · Answer 2 · edited Dec 02 '19 at 05:51

3

swal({
     html: data,
     showCloseButton: false,
     showCancelButton: false,
     width: 800,
     showConfirmButton: false,
     onClose: () => {
         this.DeleteUnsavedImages();
     }
})

private DeleteUnsavedImages(){
}

edited Dec 02 '19 at 05:51

Community

1
1

answered Apr 11 '19 at 09:12

Igor.V

31
3

score 0 · Answer 3 · answered Mar 12 '21 at 17:00

0

swal({
    title: "client",
    content: html,
    buttons:
    {
        cancel: {
            text: "Close",
            visible: true,
            closeModal: true,
        },
        confirm: {
            text: "Download",
            visible: true,
            closeModal: false
        }
    },
}).then((confirm) => {
    if (confirm) {
        download();
    }
    else {
        DeleteUnsavedImages();
    }
});

function DeleteUnsavedImages(){
    var test = "-1";
}

answered Mar 12 '21 at 17:00

Grsn Chml

1
2

Please don't post only code as an answer, but also provide an explanation of what your code does and how it solves the problem of the question. Answers with an explanation are usually more helpful and of better quality, and are more likely to attract upvotes. – Hasip Timurtas Mar 13 '21 at 06:59

How to listen for when sweet alert closes

3 Answers3

Linked