Page is not waiting for response from SweetAlert confirmation window
You cannot use this as a drop-in replacement for confirm
. confirm
blocks the single thread of execution until the dialog has been acknowledged, you cannot produce the same behavior with a JavaScript/DOM-based dialog.
You need to issue a request to /delete.php?id=100
in the success callback for your alert box.
Instead of...
swal("Deleted!", "Your imaginary file has been deleted.", "success");
You need
<a href="#">Delete<a>
...
$.post('/delete.php?id=100').then(function () {
swal("Deleted!", "Your imaginary file has been deleted.", "success");
});
You also must fix your delete.php
to only accept POST
requests. It's a huge problem to allow GET
requests to delete resources. The first time Google or any other crawler finds your page, it will look at the href
of every link in your document and follow each link, deleting all of your content. They will not be stopped by the confirm
box, as they probably (with the exception of Google) won't be evaluating any JavaScript.
You can do it this way.
HTML:
<a href="/delete.php?id=100" class="confirmation" >Delete</a>
JS:
$('.confirmation').click(function (e) {
var href = $(this).attr('href');
swal({
title: "Are you sure?",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: true,
closeOnCancel: true
},
function (isConfirm) {
if (isConfirm) {
window.location.href = href;
}
});
return false;
});
Seems a hack but it's working for me.