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 :-)

Solution 1

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";
   }

Solution 2

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

private DeleteUnsavedImages(){
}

Comments

[fubar]

You're not calling the function DeleteUnsavedImages. You're providing a reference to a function, which is then called when the alert closes.

[Himanshu Upadhyay]

yes, Its called passing a reference of the function to call when onClose gets fired of swal.

[fubar]

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.

[Himanshu Upadhyay]

Going to update my comment in answer so it will make the concept clear. Thanks for mentioning it @fubar.

[javier_domenech]

wouldn't be enough to use the "then(..)" statement instead of the onClose property?

[Alexander Kim]

@vivoconunxino .then() won't run on modal close.

[FredyWenger]

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.

[Hasip Timurtas]

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.