how to close sweet alert on ajax request completion

javascript jquery angularjs ajax sweetalert

98,406

Solution 1

For automatically hiding the pop-over when it's done, you should set your initial pop-over to a variable so you can access it later. Maybe:

function GetDataFromServer(url) {
    SweetAlert.swal({
        title: "",
        text: "Please wait.",
        imageUrl: "../../app/app-img/loading_spinner.gif",
        showConfirmButton: false
    });
    return $http.get(url)
    .then(success)
    .catch(exception);
    function success(response) {
        swal.close()
        return response.data;
    }
    function exception(ex) {
        return (ex);
    }

}

It's right on: https://t4t5.github.io/sweetalert/ in the methods section near the bottom.

Since you don't have a specific 'way' you want to do hide the ok button and you're just looking for suggestions, you could always just use a little CSS to target it and give it the ol display: none; setup.

Solution 2

You can close current showing sweetalert by using below line of code anywhere you want.

swal.close();

That's it!

Solution 3

You can use the close method over the sweet object see the documentation in down part

https://t4t5.github.io/sweetalert/

swal.close(); --> Close the currently open SweetAlert programmatically.

self.showProgress = function(message) {
  swal({ title: message });
  swal.showLoading();
};

self.hideProgress = function() {
  swal.close();
};

Solution 4

SweetAlert has close method if you check the docs at http://t4t5.github.io/sweetalert/

You can use SweetAlert.close() to close the sweetalert in angular.

Solution 5

If you use swal2 you can close it using Swal.close() from anywhere inside your code for closing it when ajax is complete I think the code below is an easy way:

$(document).ajaxComplete(function () {
        Swal.close();
});

View more solutions

98,406

Kgn-web

Web Application Engineer

Updated on July 09, 2022

Comments

Kgn-web almost 2 years
I am using Sweet-alert in my angular app.
```
function GetDataFromServer(url) {
        SweetAlert.swal(
    {
        title: "",
        text: "Please wait.",
        imageUrl: "../../app/app-img/loading_spinner.gif",
        showConfirmButton: false
    });
        return $http.get(url)
        .then(success)
        .catch(exception);
        function success(response) {
            //SweetAlert.swal(
            //  {
            //      title: "",
            //      text: "data loaded",
            //  });
            return response.data;
        }
        function exception(ex) {
            return (ex);
        }

    }
```
Req #1 (Main Objective of my this post)

What I am looking for is when the ajax request completes i.e., controls enters in the then(), Sweet alert should automatically hide.

Req #2 Also while request processing, I don't want to have the Close pop-up button (Ok button) in the sweet alert.

As per the documentation,showConfirmButton: false should hide it but it's not.

Any help/suggestion highly appreciated.
Thanks.
- Eric Hodonsky almost 7 years
  
  Hold on, what are you asking, it looks like you're asking two different things, here. Do you wan to hide the 'ok' button or do you want to close the pop-up progamatically?
- Kgn-web almost 7 years
  
  @Relic, yes you're right I updated the post
- Eric Hodonsky almost 7 years
  
  I edited my answer, please see for full success!
Kgn-web almost 7 years

Your post is not clear, can you please add proper snippet??
Kgn-web almost 7 years

TypeError: SweetAlert.close is not a function
Kgn-web almost 7 years

TypeError: SweetAlert.close is not a function
Eric Hodonsky almost 7 years

sa.close(), notice how I assigned the SweetAlert to a variable
Kgn-web almost 7 years

Ya, I tried that as well but still the same error sa.close is not a function
erdimeola almost 7 years

Check your version.
Eric Hodonsky almost 7 years

Hmm, so their docs don't show good examples of implimentation, check in your browser console of swal is available. Then try just swal.close() like it is exactly, I'll update my post to reflect the suggested changes
Kamlesh over 2 years

swal.close() solved my issue. Thanks.