I have been playing a little with the SweetAlert plugin: Sweet alert
I wanted to make a delete button, where the user gets prompted before the actual delete. When the user then presses "delete" again, is then says "done" and the user has to click "ok" again for the prompt to go away for good.
SweetAlert has a timer function, so you can auto-close that last "Done" prompt after a few seconds or so, which works just fine. They also have a feature, where you can implement a function to be run when the user clicks "OK" on the "Done" prompt. Problem is, that function is not ran if the prompt auto closes after the timer is done.
Any ideas how this can be done?
With timer
and function not being run:
swal({
title: "Deleted!",
text: "Your row has been deleted.",
type: "success",
timer: 3000
},
function () {
location.reload(true);
tr.hide();
});
Without timer
, but with a working function (when clicking the "ok" button):
swal("Deleted!", "Your row has been deleted.", "success"), function () {
location.reload();
tr.hide();
};
Explanation
I think you have to take the swal
apart from the function. What I mean is that the swal
is displayed, the function runs on the background and the modal automatically closes.
Javascript/jQuery:
swal({
title: "Deleted!",
text: "Your row has been deleted.",
type: "success",
timer: 3000
});
function () {
location.reload(true);
tr.hide();
};
Your code with an example of SweetAlert:
swal({
title: "Are you sure?",
text: "You will not be able to recover this imaginary file!",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DD6B55",
confirmButtonText: "Yes, delete it!",
cancelButtonText: "No, cancel plx!",
closeOnConfirm: false,
closeOnCancel: false
},
function (isConfirm) {
if (isConfirm) {
swal({
title: "Deleted!",
text: "Your row has been deleted.",
type: "success",
timer: 3000
});
function () {
location.reload(true);
tr.hide();
};
}
else {
swal("Cancelled", "Your imaginary file is safe :)", "error");
}
});