问题描述
我想向一个按钮添加一个删除功能,该按钮是卡片的一部分,该按钮封装在一种形式中,这是我得到的:
<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
解决方法
好的,这就是我解决的方法,我不确定这是否是正确的方法,但它有效。
表单 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,这让我更加困惑....