我在 Django 中使用 CBV 来删除项目。我想要做的是当我点击按钮删除时,而不是将我重定向到 post_confirm_delete 视图,我想弹出一个模式,我在其中显示用户是否要删除对象的问题和一个用于确认的按钮和other 删除对象。我在 HTML 中试过这个:
<button class="btn" data-toggle="modal" data-target="#fm-modal-grid">Delete</button>
<div class="modal fade" id="fm-modal-grid" tabindex="-1"
role="dialog" aria-labelledBy="fm-modal-grid"
aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<button class="close" data-dismiss="modal" aria-label="Cerrar">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-12 col-sm-6">
<p>Are you sure you want to delte {{post.title}}</p>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<a href="{% url 'blog:post_remove' pk=post.pk %}" class="btn">Delete</a>
<button class="btn btn-primary" data-dismiss="modal">Cancelar</button>
</div>
</div>
</div>
</div>
我在视图类的 delte CBV 中有这个:
class PostDeleteView(DeleteView, LoginRequiredMixin):
model = Post
success_url = reverse_lazy('post_list')
template_name = 'blog/post_list.html'
url 文件如下所示:
urlpatterns = [
path('',views.PostListView.as_view(),name='post_list'),
path('article/', views.ArticleView.as_view(), name="article"),
path('newpost/', views.CreatPostView.as_view(), name="new_post"),
path('post/<int:pk>', views.PostDetailView.as_view(), name='post_detail'),
path('post/<int:pk>/edit/', views.PostUpdateView.as_view(), name='post_edit'),
path('post/<int:pk>/remove/', views.PostDeleteView.as_view(), name='post_remove'),
]
当我按下模式内的删除按钮时,它会将我重定向到我的索引,但不会删除该对象。我该怎么做?
由docs
只有当请求方法是 POST 时,才会删除给定的对象。
所以链接是它不起作用的原因。我通过将用于删除的模式按钮放在这样的表单中来解决它:
<form action="{% url 'blog:post_remove' pk=post.pk %}" method="POST">
{% csrf_token %}
<button class="btn">Delete</button>
</form>
实际上,您需要将按钮放在表单中才能进行 POST。
另一个解决方案是使用一些 JS 触发模式,然后当您确认删除时,您可以进行 POST 类型的 Ajax 调用。所以你没有义务把按钮放在表格里。
$.confirm({
title: 'Deletion pop-up',
content: 'Do you want to proceed ?',
buttons: {
confirm: function () {
$.ajax({...}),
success: function(response){...},
}
}
)};
我正在为 Bootstrap 5 添加我的解决方案
<!-- Button that opens a modal -->
<button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#delete_item">
Delete
</button>
<!-- Modal -->
<div class="modal fade" id="delete_item" data-bs-backdrop="static"
data-bs-keyboard="false" tabindex="-1" aria-labelledby="delete_item_label" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="delete_item_label">Delete {{ object }}?</h5>
</div>
<form action="{% url 'object_delete_url' object.id %}" method="post">
{% csrf_token %}
<div class="modal-body">
<p>Are you sure you want to delete "{{ object }}"?</p>
{{ form }}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-danger" value="Confirm">Delete</button>
</div>
</form>
</div>
</div>
</div>