Django 删除确认答案

【问题标题】：Django Delete ConfirmationDjango 删除确认
【发布时间】：2016-09-20 18:32:09
【问题描述】：

我有一个垃圾桶图标，用于 Django 网站上的删除按钮。

它只是一个锚标签，里面有一个 i 标签，它的 href 设置为一个删除视图，传递模型元素的 id。

它工作得很好，但我想创建一个对话框弹出窗口，在删除之前要求确认。

我已经看到了几种方法来做到这一点，但它们都需要输入而不是锚。

我还需要在触控设备上进行这项工作。

如何将其更改为输入元素并将图标保留为按钮而不是显示提交按钮。以及如何让对话框弹出并在单击“是”时将正确的 url 和 id 传递给提交？

任何建议将不胜感激。

【问题讨论】：

标签： javascript html django

【解决方案1】：

最简单的方法是添加确认提示：

<a ... onclick="return confirm('Are you sure you want to delete this?')">Delete</a>

但你不应该使用内联 javascript，所以尝试添加一个类并将其抽象掉。这是 jquery：

<a class="confirm-delete" ...>Delete</a>
$(document).on('click', '.confirm-delete', function(){
    return confirm('Are you sure you want to delete this?');
})

【讨论】：

我会在哪里传递 url 和 id
您说它现在正在工作，所以您只需保持原样并添加 onclick 事件。我想它在href="/object/24/delete" 中。为简洁起见，我将... 用于其他属性。
感谢您也添加了 jquery 版本，绝对有助于同时查看内联和 jquery 版本！
花了一段时间才意识到删除视图不应该测试 method=='POST'，因为它是一个 GET

【解决方案2】：

让它成为你的锚标记：

<a class="icon-trash" id="delete-object" data-object-id="{{ object.id }}">Delete</a>

请注意，我们有一个带有属性的object.id。我们将在 javascript 部分需要它。

你可以在body标签关闭之前在页面底部写这样的东西：

使用片段更新

在这里您可以尝试演示。当您将代码放在 body 标签关闭之前，它应该可以工作：

var elm = document.getElementById('delete-object');
var objectID = elm.getAttribute('data-object-id');
var resultDiv = document.getElementById('result');
elm.addEventListener('click', function() {
  var ask = confirm('r u sure?');
  if (ask && objectID) {
    var r = "Page will be redirected to </object/delete/" + objectID + "/>";
    resultDiv.textContent = r;
  } else {
    resultDiv.textContent = "User cancelled the dialog box...";
  }
  return false;
});

.delete-link {
  background-color: red;
  color: white;
  border: 1px solid white;
  cursor: pointer;
  padding: 3px;
}
#result {
  margin: 20px;
  padding: 10px;
  border: 1px solid orange;
}

<a class="delete-link" id="delete-object" data-object-id="3">Delete</a>
<div id="result"></div>

【讨论】：