javascript - 如何使用 SweetAlert 进行 AJAX 调用

标签 javascript jquery sweetalert sweetalert2

<分区>

当用户想要删除帐户时,我正在使用 SweetAlert 进行 AJAX 调用。但我的代码在下面不起作用。我还想添加确认和取消按钮,但我不知道如何很好地使用 SweetAlert

我们将不胜感激。

我正在使用 SweetAlertCDN

https://unpkg.com/sweetalert/dist/sweetalert.min.js来自 https://sweetalert.js.org/

 swal({
   closeOnClickOutside: false,
   icon: "warning",
   title: 'Do you want to remove your account?',
   text: 'This action can not be undo',
   showConfirmButton: false,
   closeOnConfirm: false,
   showSpinner: true
 },function () {
   $.ajax({
     url: "delete_account.php",
     method: "POST",
     data: {
       id: 5
     },
     success: function () {
       swal("Deleted!", "Successfully deleted", "success");
     }
   });
 });

最佳答案

您可以在确认甜蜜警报时调用 ajax,如下所示。

swal({
    title: "Are you sure to delete this  of ?",
    text: "Delete Confirmation?",
    type: "warning",
    showCancelButton: true,
    confirmButtonColor: "#DD6B55",
    confirmButtonText: "Delete",
    closeOnConfirm: false
  },
  function() {
    $.ajax({
        type: "post",
        url: "url",
        data: "data",
        success: function(data) {}
      })
      .done(function(data) {
        swal("Deleted!", "Data successfully Deleted!", "success");
      })
      .error(function(data) {
        swal("Oops", "We couldn't connect to the server!", "error");
      });
  }
);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert-dev.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css">

关于javascript - 如何使用 SweetAlert 进行 AJAX 调用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46356812/

相关文章:

javascript - Redux Thunk 尝试返回 promise

javascript - 联系表 7 带自动填充字段的条件字段

javascript - 从按钮到文本输入的 HTML 转换

javascript - 使用 sweetalert 按 OK 后重定向页面

javascript - 如何将javascript变量作为值加载到引导模式文本框中

javascript - 当字段无效时 Sweetalert 弹出消息

javascript - Head.js 在 IE9 及以下只加载第一个样式表

javascript - 更改图例框轮廓 Chart.js 2

android - 从 jquery 移动 (phonegap) 应用程序在 android 中打印

javascript - 处理 2 个元素的更改