JSFiddle - React, Tailwind, and code Playground

by Dhiraj Bodicherla

HTML

<link rel="stylesheet" href="http://tristanedwards.me/u/SweetAlert/lib/sweet-alert.css">
<script src="http://tristanedwards.me/u/SweetAlert/lib/sweet-alert.js"></script>
<a href="#" onclick="confirmDelete()">Ajax in this Delete will NOT work</a>

<a href="#" onclick="confirmDelete2()">Ajax in this Delete will work</a>

CSS

a {
    font-size: 18px;
    display: block;
}
a:nth-child(1), a:nth-child(1):visited {
    color: red;
}
a:nth-child(2), a:nth-child(2):visited {
    color: green;
}

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
    }, 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");
            }
        });
    });
}

function confirmDelete2() {
    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: "/echo/json",
            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");
            }
        });
    });
}