Question

我是一名新手，正在学习使用javascript，express，node，mongoose进行的Web开发。我希望我的应用使用引导程序显示删除确认模式，并且仅在单击“是，删除”时删除。

模态出现了，但是我无法使其正常工作（它删除了错误的数据-猫鼬中的第一个数据，而不是所选的那个）。

关于应用程序：我的应用程序中有一个页面，我可以选择一个特定的作者。当我单击作者时，它将列出作者创建的所有博客标题。每个博客标题旁边都有一个“删除”按钮。

我一直在搜索一些与我的问题类似的解决方案，但是我没有运气

<% 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">&times;</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个博客，而我删除了其中一个博客，则应该删除正确的（选定的博客）

Answer 1

您应该使用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">&times;</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）之前，应如何实施删除确认引导程序模式？

1 个答案: