【问题标题】:sweetalert2 confirm delete when render returning a link in Datatablessweetalert2 在渲染返回数据表中的链接时确认删除
【发布时间】:2021-03-27 13:38:58
【问题描述】:

我正在使用 Datatable 并通过呈现返回链接来执行我的删除。我想通过 SweetAlert2 确认来删除,但是它无法按预期工作。

我如何使用 sweetalert,我无法分配 id 来返回渲染链接

【问题讨论】:

  • datatable 这个词不清楚。将鼠标悬停在该标签上并阅读说明。你是说 jQuery DataTables 库吗?如果是这样,您应该为此使用datatables 标签。
  • 您能否澄清您所说的“它无法按预期工作” 的意思?究竟发生了什么?有什么错误吗?如果是这样,请向我们展示这些错误(作为文本)。另见minimal reproducible example。我们怎样才能重现这个问题?
  • 删除时似乎不起作用。它省略了确认。你想看完整的代码吗?
  • 查看minimal reproducible example开头的三个要点。另外:控制台中有任何错误吗?另外:datatable 是什么?
  • 只是给您一些有根据的猜测:您使用的是Swal.fire - 但库是swal 而不是Swal。似乎不需要函数fire。只需使用swal(...)id="del" 的 HTML 元素在哪里?您的目标似乎是一个不存在的元素:$('#del')。之后,您可能需要处理链接事件,以允许您的弹出事件触发。但这些只是猜测,基于我所掌握的不完整信息。

标签: datatables render sweetalert2


【解决方案1】:

我不确定你在哪里卡住了。

这是我的版本:

我正在使用 SweetAlert 2:

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10.15.7/dist/sweetalert2.all.min.js"></script>

我的 DataTable 中有以下渲染函数:

{
  render: function (data) {
    return '<a id="del" href="/your/example/here/' + data + '">Remove</a>';
  }
}

这是您的代码的简化版本,仅作为演示。

我有以下点击处理程序:

$('#del').on('click', function( event ) {
  event.preventDefault(); // don't forget to prevent the default event
  Swal.fire({
    title: 'Are you sure?',
    text: "You won't be able to revert this!",
    icon: 'warning',
    showCancelButton: true,
    confirmButtonColor: '#3085d6',
    cancelButtonColor: '#d33',
    confirmButtonText: 'Yes, delete it!'
  }).then((result) => {
    if (result.isConfirmed) {
      Swal.fire(
        'Deleted!',
        'Your file has been deleted.',
        'success'
      )
    }
  });
});

这会生成一个带有链接的表格。

当我点击任何链接时,我会收到以下弹出警报:

我没有处理任何与实际使用链接删除资源有关的事情。我把它留给你,作为后续任务,在你得到警报之后。


您没有真正解释您所面临的具体问题是什么,只是说“它不起作用”。

如果您在此之后有新的、额外的问题,那么您可以打开一个新问题 - 但请尝试提供足够的详细信息,包括来自浏览器控制台的错误消息以及带有相关代码的易于重现的问题描述。

【讨论】:

  • 我之前试过这个,它确实没有错误,它只是忽略了我正在使用的 SweetAlert 并删除。我在_Layout 使用&lt;link rel = "stylesheet" href = "sweetalert2 / dist / sweetalert2.min.css" /&gt; 是否重要?
  • 您问题中的代码与我的答案中的代码不同。
  • 我已经尝试了您的代码,并且正在尝试更多。它仍然忽略 SweetAlert
  • 在这种情况下,您需要提供minimal reproducible example
  • 我在 Swal “未解析的变量或类型 Swal”处看到警告
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2021-12-19
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多