I'm new at Javascript - coding it actually for the first time.
I'm trying to do a button with delete confirmation with SweetAlert. Nothing happens when I press the button with onclick="confirmDelete()"
. This code may be just crab, but here it is:
<script type="text/javascript">
function confirmDelete() {
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!",
closeOnConfirm: false
)},
$.ajax({
url: "scriptDelete.php",
type: "POST",
data: {id: 5},
dataType: "html",
success: function () {
swal("Done!","It was succesfully deleted!","success");
}
});
}
</script>
<a href="#" onclick="confirmDelete()">Delete</a>
Can I add any alert if deleting fails?
If I understand your question correctly, you are asking how to handle error condition in ajax request. Ajax settings has an error attribute and it can be used like this
$.ajax({
.... other settings you already have
error: function (xhr, ajaxOptions, thrownError) {
swal("Error deleting!", "Please try again", "error");
}
});
Also, you are invoking swal in a wrong way. Swal has a callback like this
swal({settings}, function(isConfirm){});
Overall code would look something like this
function confirmDelete() {
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!",
closeOnConfirm: false
}, function (isConfirm) {
if (!isConfirm) return;
$.ajax({
url: "scriptDelete.php",
type: "POST",
data: {
id: 5
},
dataType: "html",
success: function () {
swal("Done!", "It was succesfully deleted!", "success");
},
error: function (xhr, ajaxOptions, thrownError) {
swal("Error deleting!", "Please try again", "error");
}
});
});
}
Here is a demo http://jsfiddle.net/dhirajbodicherla/xe096w10/33/