javascript - 如何取消确认甜蜜警报

Question

嗨，我正在使用甜蜜警报从我的网站上删除产品我想使用它有两个选项，第一个是“确定”，第二个是“取消”

但是当我点击页面上的任何位置时，它会删除并且取消按钮不起作用

这是我的代码

 $(document).on('click', '#removeCat', function(e) {
    e.preventDefault();
    var id = $(this).data('id');
    swal({
        title: "are u sure?",
        type: "error",
        confirmButtonClass: "btn-danger",
        confirmButtonText: "ok",
        cancelButtonText: "cancel",
        showCancelButton: true,
    })
    .then(function() {
    $.ajax({
        type: "post",
        url: "{{url('dashboard/shop/product-category/delete')}}",
        data: {
            id: id,
            "_token": $('#csrf-token')[0].content //pass the CSRF_TOKEN()
        },
        success: function(data) {
            var url = document.location.origin + "/dashboard/shop/product-category";
            location.href = url;
        }
    });
});

});

标签： javascriptphpajaxlaravelsweetalert

Answer 1

这是解决方案：

swal({
  title: "Are you sure?",
  text: "You will not be able to recover this imaginary file!",
  type: "warning",
  showCancelButton: true,
  confirmButtonClass: "btn-danger",
  confirmButtonText: "Yes, delete it!",
  cancelButtonText: "No, cancel plx!",
  closeOnConfirm: false,
  closeOnCancel: false
},
function(isConfirm) {
  if (isConfirm) {
    $.ajax({
        type: "post",
        url: "{{url('dashboard/shop/product-category/delete')}}",
        data: {
            id: id,
            "_token": $('#csrf-token')[0].content //pass the CSRF_TOKEN()
        },
        success: function(data) {
            var url = document.location.origin + "/dashboard/shop/product-category";
            location.href = url;
        }
    });
  } else {
    swal("Cancelled", "Your imaginary file is safe :)", "error");
  }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.css" integrity="sha256-Z8TW+REiUm9zSQMGZH4bfZi52VJgMqETCbPFlGRB1P8=" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.css" integrity="sha256-zuyRv+YsWwh1XR5tsrZ7VCfGqUmmPmqBjIvJgQWoSDo=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.js" integrity="sha256-ZvMf9li0M5GGriGUEKn1g6lLwnj5u+ENqCbLM5ItjQ0=" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.js" integrity="sha256-JirYRqbf+qzfqVtEE4GETyHlAbiCpC005yBTa4rj6xg=" crossorigin="anonymous"></script>