Question

我想向一个按钮添加一个删除功能，该按钮是卡片的一部分，该按钮封装在一种形式中，这是我得到的：

<form class="form-events" action="/delete" method="post">
  <% events.forEach( function (event) { %>
    
      <div class="card col-lg-3" style="width: 18rem;">

          <img class="card-img-top">
          <div class="card-body">
          <h5 class="card-title"><%= event.title %></h5>
          <p class="card-text"><%= event.description %></p>
          <p class="card-text"><%= event.date %> </p>
          <p class="card-text"><%= event.capacity %></p>
          <a href="#" class="btn btn-primary">Update</a>
          <button onclick="this.form.submit()" value="<%= event._id %> " name="deletebtn" class="btn btn-danger">Delete</button>
        </div>
      </div>
   
  <% }); %>
</form>

这是它的路线：

// Delete an event
app.post("/delete", function (req, res) {
  const deletedItemId = req.body.deletebtn;
  Event.findByIdAndRemove(deletedItemId, function (err) {
    if (!err) {
      console.log("Successfully deleted");
      res.redirect("/admin");
    } else {
      console.log(err);
    }
  });
});

当我按下删除按钮时出现此错误：

     reason: Error: Argument passed in must be a single String of 12 bytes or a string of 24 hex 
                   characters

Answer 1

好的，这就是我解决的方法，我不确定这是否是正确的方法，但它有效。

表单 admin.ejs

<% events.forEach( function (event) { %>
      <form class="form-events" action="/delete" method="post">

        <div class="card col-lg-3" style="width: 18rem;">

          <img class="card-img-top">
          <div class="card-body">

            <h5 class="card-title"><%= event.title %></h5>
            <p class="card-text"><%= event.description %></p>
            <p class="card-text"><%= event.date %> </p>
            <p class="card-text"><%= event.capacity %></p>

            <a href="/create_event" class="btn btn-primary">Update</a>
            <button name="deleteBtn" value="<%=event._id%>" type="submit" class="btn btn-danger">Delete</button>
          </div>
        </div>

        <% }); %>
      </form>

路线的 app.js

app.post("/delete", function (req, res) {

  const deletedItemId = req.body.deleteBtn;

  Event.findByIdAndDelete(deletedItemId, function (err) {
    if (!err) {
      console.log("Successfully deleted");
      res.redirect("/admin");
    } else {
      console.log(err);
    }
  });
});

现在它完美地适用于数据库，但我在谷歌上搜索的大多数东西都可以使用

/*for the route */
app.delete(“delete/:id”), function() 

/*for the form */
<form method="POST" action="/delete/<%= event._id%>?_method=DELETE">
<button type="submit">Delete</button>
</form>

我尝试过但又遇到了一些错误并返回到原来有效的错误，我不太了解整个 app.post，app.delete 因为你也使用了 /delete 操作，然后你就可以使用猫鼬删除它，我也不确定，但对于 HTML 中的表单方法，据说您只能使用 post 和 put，这让我更加困惑....

如何将 DELETE 操作添加到按钮 Node.js

1 个答案: