How to use the sweet alert 2 jquery plugin while trigerring the AJAX calls?

There is a cancel button on html page. When I click the button the alert popups with Ok and Cancel option along with a cross button at the right top corner. So when I click the Ok button the AJAX event gets triggered but the problem is when I click cancel or click on cross button as well the alert the AJAX event gets triggered which is supposed not to.
Here is the code:

I dont want to call the AJAX when cancel is clicked or the cross button.
What should I do?

 $("#cancelButton").click(function(){
      Swal.fire({
      title: "We are sad to see you go! 😱",
      text: "Do you really want to unsubscribe?",
      icon: "warning",
      showCloseButton: true,
      button: "Ok",
      showCancelButton: true
      }).then((result) => {
        $.LoadingOverlay("show");
          $.ajax({
            type: "GET",
            url: "/v1/subscriptions/{{user.subsID}}",
            dataType: "json",
            contentType: "application/json",
            success: function(response){
              if (response.status == '200') {
                $.LoadingOverlay("hide");
                Swal.fire({
                title: "Cancelled",
                text: "You have been unsubscribed and will no longer hear from us after the end of the current month subscription! ☹️",
                icon: "success",
                button: "Ok",
                showCancelButton: true
                }).then((result) => {
                if (result) {
                window.location.reload();
                }
              });
          }
          else if (response.status == '500') {
            $.LoadingOverlay("hide");
            Swal.fire({
            title: "Error",
            text: "Subscription has already been cancelled",
            icon: "error",
            button: "Ok",
            showCancelButton: true
          })
          }
        }
          });
            })
    });

1 thought on “How to use the sweet alert 2 jquery plugin while trigerring the AJAX calls?”

  1. Swal.fire({
        title: 'A cool title',
        icon: 'info',
    }).then((result) => {
        if (result['isConfirmed']){
            // Put your function here
        }
    })
    

    This should work, there is a isConfirmed attribute in the result variable

    Reply

Leave a Comment