在实际删除数据(POST)之前,我应该如何实现删除确认引导模式?
我是一个使用javascript,express,node,mongoose的新手和学习网站开发。我希望我的应用程序使用bootstrap显示删除确认模式,仅当我单击“是,删除”时才删除。
模态显示但我无法使其正常工作(它删除了错误的数据 - mongoose中的第一个数据而不是选择的数据)。
关于应用程序:我的应用程序中有一个页面,我可以选择一个特定的作者。当我点击作者时,它将列出作者创建的所有博客标题。每个博客标题旁边都有一个删除按钮。
我一直在谷歌搜索一些类似于我的问题的解决方案,但我没有运气
<% author.blogs.forEach(function(blog) { %>
<form class="delete-form" action="/authors/<%= author._id%>/blogs/<%=blog._id%>?_method=DELETE" method="POST">
<button type="button" class="btn btn-sm btn-danger mb-2" data-toggle="modal" data-target="#exampleModal">Delete Delete <%=blog._id%></button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirm Delete <%= blog._id%></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete</button>
</div>
</div>
</div>
</div>
</form>
<% })%>
假设作者有5个博客,我删除了其中一个博客,它应该删除正确的(选定的博客)
回答如下:你应该使用js confirm()
函数而不是它的非常简单和完全为此看到这个链接检查how to use confirm function只需将其添加到这样的表单标签
<form onsubmit="confirm("Are you sure you want to delete")" class="delete-form" action="/authors/<%= author._id%>/blogs/<%=blog._id%>?_method=DELETE" method="POST">
<button type="button" class="btn btn-sm btn-danger mb-2" data-toggle="modal" data-target="#exampleModal">Delete <%=blog._id%></button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirm Delete <%= blog._id%></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete</button>
</div>
</div>
</div>
</div>
在实际删除数据(POST)之前,我应该如何实现删除确认引导模式?
我是一个使用javascript,express,node,mongoose的新手和学习网站开发。我希望我的应用程序使用bootstrap显示删除确认模式,仅当我单击“是,删除”时才删除。
模态显示但我无法使其正常工作(它删除了错误的数据 - mongoose中的第一个数据而不是选择的数据)。
关于应用程序:我的应用程序中有一个页面,我可以选择一个特定的作者。当我点击作者时,它将列出作者创建的所有博客标题。每个博客标题旁边都有一个删除按钮。
我一直在谷歌搜索一些类似于我的问题的解决方案,但我没有运气
<% author.blogs.forEach(function(blog) { %>
<form class="delete-form" action="/authors/<%= author._id%>/blogs/<%=blog._id%>?_method=DELETE" method="POST">
<button type="button" class="btn btn-sm btn-danger mb-2" data-toggle="modal" data-target="#exampleModal">Delete Delete <%=blog._id%></button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirm Delete <%= blog._id%></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete</button>
</div>
</div>
</div>
</div>
</form>
<% })%>
假设作者有5个博客,我删除了其中一个博客,它应该删除正确的(选定的博客)
回答如下:你应该使用js confirm()
函数而不是它的非常简单和完全为此看到这个链接检查how to use confirm function只需将其添加到这样的表单标签
<form onsubmit="confirm("Are you sure you want to delete")" class="delete-form" action="/authors/<%= author._id%>/blogs/<%=blog._id%>?_method=DELETE" method="POST">
<button type="button" class="btn btn-sm btn-danger mb-2" data-toggle="modal" data-target="#exampleModal">Delete <%=blog._id%></button>
<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Confirm Delete <%= blog._id%></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
Are you sure?
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">No, cancel</button>
<button type="submit" class="btn btn-danger">Yes, delete</button>
</div>
</div>
</div>
</div>