通过 SweetAlert 确认删除数据 table 中的行

Question

我正尝试通过按删除图标删除一行，但我首先想要一个 SweetAlert 确认 window。

我的代码：

$(document).ready(function() {
      //$( 'button[data-target="#delete"' ).click(function() {
      $('##ads-overview tbody').on('click', 'button[data-target="#delete"', function() {
        swal({
          title: "Weet u het zeker?",
          text: "Deze actie is niet meer te herstellen",
          showCancelButton: true,
          confirmButtonColor: "#DD6B55",
          confirmButtonText: "Ja, ik weet het zeker!",
          cancelButtonText: "Annuleren",
          closeOnConfirm: false,
          closeOnCancel: false
        }, function(isConfirm) {
          if (isConfirm) {
            swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");,

            function() {
              table.row($(this).parents('tr')).remove().draw();
            }
          }
          } else {
            swal("Geanulleerd", "De advertentie is niet verwijderd", "error");
          }
        });
      });
    });

https://jsfiddle.net/6n3zsfd5/

警报 window 没有出现。我做错了什么？

Answer 1

工作版本：https://jsfiddle.net/6n3zsfd5/5/

$(document).ready(function () {
      var table = $('#ads-overview').DataTable();

      $('#ads-overview tbody').on('click', 'button[data-target="#delete"]', function () {
          var btn = this;

          swal({
              title: "Weet u het zeker?",
              text: "Deze actie is niet meer te herstellen",
              showCancelButton: true,
              confirmButtonColor: "#DD6B55",
              confirmButtonText: "Ja, ik weet het zeker!",
              cancelButtonText: "Annuleren",
              closeOnConfirm: false,
              closeOnCancel: false
          }, function (isConfirm) {
              if (isConfirm) {
                  swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");
                  table.row($(btn).parents('tr')).remove().draw(false);
              } else {
                  swal("Geanulleerd", "De advertentie is niet verwijderd", "error");
              }
          });
      });
});

您调用 SweetAlert 的方式没有任何问题。您的代码中存在一些语法错误，并且您设置 DataTable 的方式存在问题。（感谢 Gyrocode.com 发现了这一点！）

对于语法错误，请打开您的开发人员工具 window 或 Javascript 控制台以查看页面加载时抛出的错误。那会把你带到有问题的地方。

具体代码修复：

您需要初始化数据表：

var table = $('#ads-overview').DataTable();

这一行的开头不需要两个哈希值，但在 "delete":

之后需要一个右括号

$('##ads-overview tbody').on('click', 'button[data-target="#delete"', function(...
...^..............................................................^

此行末尾有一个逗号：

swal("Verwijderd!", "De advertentie is succesvol verwijderd", "success");,

这真的没有意义：

function() {
    table.row($(this).parents('tr')).remove().draw();
}

不需要将它包装在函数中；只需调用方法即可。

这应该可以解决所有问题。此答案顶部的 JSFiddle 包含所有这些修复。

通过 SweetAlert 确认删除数据 table 中的行

Remove row in data table with SweetAlert confirmation

jquery

datatables

sweetalert