在javascript弹出按钮中实现删除功能

Question

谁能告诉我如何在 javascript 弹出按钮中实现删除功能？

1. 我创建了一个用于显示数据库中元素的 for 循环。

2. 在这个 for 循环中，我在 html 中创建了一个“删除”按钮，用于激活 javascript 弹出窗口。

3. javascript 弹出窗口要求用户确认“是否要删除该项目？”

4. 如果用户想要确认删除特定项目 (item.id)，他可以点击 javascript 弹出窗口中显示的第二个“删除”按钮。

5. 第二个“删除”按钮应通过生成动态链接来删除项目（例如 ... /delete/3）

我已成功将 javascript 变量链接到动态链接，但 jinja 变量的内容没有传递给 javascript 变量。

** For loop :**

{% for item in all %}
<button class="button"onclick="document.getElementById('id01').style.display='block'">Delete</button><br>
{{ item.Bedrijfsnaam }}<br>
{{ item.Voornaam }}<br>
{{item.id}}
<meta name="item-id" content="{{ item.id }}"></meta>
{% endfor %}

**Javascript :**

var idlink = "delete/" + $('#item-id').data();

**HTML button with dynamic link :**

<button type="button" onclick="parent.location=idlink" class="deletebtn">Delete</button>

** 但是创建的链接仍然无效：**

http://127.0.0.1:8000/delete/[object%20Object]

我该如何解决这个问题？

关键是我想通过单击我的 HTML 代码中生成动态链接的按钮来从我的数据库中删除一个项目。但是我想在删除项目之前使用 javascript 显示一个弹出窗口来确认删除操作。

Answer 1

urls.py

path('delete/<int:pk>', views.delete, name='delete')

views.py

def delete(request, member_id)
    item = members.object.get(pk=member_id)
    item.delete()

循环内的按钮

<button class="button" onclick="setPkFunc('{{item.pk}}')">Delete</button>

您的动态按钮

<button id="id01" onclick="deleteFunc()" class="deletebtn">Delete</button>

javascript

<script>
  var link = "";
  function setPkFunc(pk) {
    link = "delete/" + pk;
    document.getElementById("id01").style.display="block";
  }
  function deleteFunc() {
    parent.location = link;
  }
</script>