如何解决用于事件创建的 MERN 堆栈中的 CRUD 操作更新不起作用
我有一个管理员创建事件的 MERN 堆栈页面,目前,我设法添加了 CREATE 操作和 DELETE,但它似乎有两个错误(一个用于创建以前工作的页面),另一个用于更新我正在尝试添加。 创建操作:
创建操作错误:
Create_event.ejs
<div class="w-50 p-3" style="width: 800px; margin: 0 auto;">
<form action="/create_event" method="POST">
<div class="form-group">
<label>Event title:</label>
<input value="<%= event.title %>" type="text" class="form-control" name="ev_title">
</div>
<div class="form-group">
<label>Description:</label>
<textarea value="<%= event.description %>" name="ev_desc" class="form-control" rows="10" cols="20"></textarea>
</div>
<div class="form-group">
<label>Date:</label>
<input value="<%= event.date %>" type="date" class="form-control" name="ev_date">
</div>
<div class="form-group">
<label>Capacity:</label>
<input value="<%= event.capacity %>" type="text" class="form-control" name="ev_cap">
</div>
<% if(event._id){ %>
<button type="submit" class="btn btn-success">Update</button>
<% }else{ %>
<button type="submit" class="btn btn-success">Create</button>
<% } %>
</form>
</div>
App.js
//Admin route,create a new event page.
app.get("/create_event",function (req,res) {
res.render("create_event");
});
//Create event.
app.post("/create_event",res) {
const event = new Event({
title: req.body.ev_title,description: req.body.ev_desc,date: req.body.ev_date,capacity: req.body.ev_cap,});
event.save(function (err) {
if (err) {
console.log(err);
} else {
res.redirect("/admin");
}
});
});
更新操作根本不起作用,我想要实现的是当管理员按下我的 Bootstrap 卡上的更新按钮时,它会将他重定向到同一个 create_event.ejs,其中根据事件按钮的按下情况完成表单在此之后,他可以更改表单的标题、discreption 等,然后只需按一个保存按钮。这是我对更新和管理页面的代码的了解程度。 更新事件
// Update an event
app.post("/update/:id",res) {
const _id = req.params.id;
const event = new Event({
title: req.body.ev_title,});
Event.findOne(
{ _id },"_id title description date capacity",function (err,data) {
if (err) {
console.log(err);
} else {
res.render("create_event",{ event: data });
}
}
);
});
因为在不同的文件中进行了许多操作,这里也是完整代码的 github,我会感谢任何帮助,对这完全陌生。 P.S 也是我的 flash 消息由于某种原因无法正常工作,但似乎我做的一切都是正确的...... Github 页面: https://github.com/azrail7/web_project21
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。