How to properly catch errors in SweetAlert

3.1k views Asked by At

I have the following swal code and it works fine if the returned status for the HTTP call is '200'. But if I get a '403' unauthorized error the swal loader keeps spinning and the message never goes away, like shown below. I'm not sure if I'm not handling the error correctly.

Can you help?

enter image description here

let that = this;
swal({
  title: 'Are you sure?',
  text: 'You won\'t be able to revert this!',
  type: 'warning',
  showCancelButton: true,
  confirmButtonText: 'Yes, delete it!',
  confirmButtonColor: '#d33',
  cancelButtonText: 'No, keep it',
  showLoaderOnConfirm: true,
  preConfirm: function (email) {
    return new Promise(function (resolve, reject) {

      that.http.get(url, {"headers": headers})
        .map(res => res)
        .subscribe(data => {
          console.log(data);
          if (data.status === 200) {
            resolve();
          } else {
            reject(data.status);
          }
      })          
    })
  },
  allowOutsideClick: false
}).then(function() {
  swal(
    'Deleted!',
    'The user has been deleted.',
    'success'
  )
}, function(dismiss) {
  if (dismiss === 'cancel') {
    swal(
      'Cancelled',
      'Nothing has been deleted!',
      'error'
    )
  }
}).catch((error) => {
  console.log('error_does_not_reach_here', error);
})
1

There are 1 answers

0
Zarkys Salas On

This is a example of my code:

 swal({
                title: "Confirm",
                text: "¿Are you sure?",
                type: "warning",
                showCancelButton: true,
                confirmButtonText: 'Aceptar',
                cancelButtonText: 'Cancelar'
            }).then(function () {
             //If Press ok, send the data
                var arr = {
                    cuil: empDP.fd.Cuil,
                    cct: empDP.fd.Cct,
                    activity: empDP.fd.Activity,                   

                };
                Vue.http.post(empDP.globalurl + "/persondata/save", arr).then(function (response) {
                    swal('Data saved correctly', '', 'success');
                    empDP.clean();
                }, function (response) {
               //If Response return error
                    swal('Show a Text Error', '', 'error');
                });