我在节点中有一个待办事项列表应用程序 - 使用express和mongoose。我想做的是在创建项目后将项目添加到同一页面上的新列表中。这些项目应该可以选择移动到另一个完成列表中。该列表是在同一页面上创建的。当我单击“移至完成列表”按钮时,没有任何反应。这些项目不会呈现在完成列表中的页面上。我没有收到任何错误。 folderList.ejs 是这样的:
<ul>
<% folderLists.forEach(folderList => { %>
<li>
<%= folderList.name %>
<!-- Form to delete items from the list -->
<form action="/folderLists/<%= folder._id %>/deleteItem/<%= folderList._id %>" method="post" style="display: inline;">
<button type="submit">Delete</button>
</form>
<!-- Form to move item to Done List -->
<form action="/folderLists/<%= folder._id %>/moveToDone/<%= folderList._id %>" method="post" style="display: inline;">
<button type="submit">Move to Done List</button>
</form>
</li>
<% }); %>
<h2>Done List</h2>
<ul>
<% folderLists.forEach(folderList => { %>
<% if (folderList.checked) { %>
<li>
<%= folderList.name %>
<!-- Additional actions if needed -->
</li>
<% } %>
<% }); %>
<a href="/mainFolder">Go back to Main Folders</a>.
folderLists.js 路由:
const express = require('express');
const router = express.Router();
// Import the Folder and Task models
const Folder = require('../models/folder');
const FolderList = require('../models/folderList');
router.get('/:id', async (req, res) => {
try {
const { id } = req.params;
const folder = await Folder.findById(id);
// Fetch all items for the given folder ID
const allItems = await FolderList.find({ folder: id });
console.log('allItems:', allItems);
const folderLists = allItems.filter(item => !item.checked);
console.log('folderLists:', folderLists);
res.render('folderLists', { folder, folderLists });
} catch (err) {
console.error(err);
res.status(500).send(err.message);
}
});
// 将项目添加到列表中
router.post('/:id/addItem', async (req, res) => {
try {
const { id } = req.params;
const { itemName } = req.body;
await FolderList.create({ name: itemName, folder: id });
res.redirect(`/folderLists/${id}`);
} catch (err) {
res.status(500).send(err.message);
}
});
//从列表中删除项目
router.post('/:id/deleteItem/:itemId', async (req, res) => {
try {
const { itemId } = req.params;
await FolderList.findByIdAndDelete(itemId);
res.redirect(`/folderLists/${req.params.id}`);
} catch (err) {
res.status(500).send(err.message);
}
});
// 将项目添加到完成列表
router.post('/:id/moveToDone/:itemId', async (req, res) => {
try {
const { itemId } = req.params;
console.log('Item ID:', itemId);
// Find the item by ID
const folderList = await FolderList.findById(itemId);
console.log('Folder List:', folderList);
// Update the item to mark it as checked
folderList.checked = true;
await folderList.save();
console.log('Item moved to Done List successfully.'); // Add this line
res.redirect(`/folderLists/${req.params.id}`);
} catch (err) {
console.error('Error moving item to Done List:', err);
res.status(500).send(err.message);
}
});
module.exports = router;
这是folderList.js 的模型:
const mongoose = require('mongoose');
const folderListSchema = new mongoose.Schema({
name: { type: String, required: true },
folder: { type: mongoose.Schema.Types.ObjectId, ref: 'Folder', required: true },
});
const FolderList = mongoose.model('FolderList', folderListSchema);
module.exports = FolderList;
当我单击“移至完成列表”按钮时,没有任何反应。这些项目不会呈现在完成列表中的页面上。我没有收到任何错误。
您应该更新您的folderListSchema,以确保您的架构包含选中的字段。也许这就是它不起作用的原因?
const folderListSchema = new mongoose.Schema({
name: { type: String, required: true },
folder: { type: mongoose.Schema.Types.ObjectId, ref: 'Folder', required: true },
checked: { type: Boolean, default: false }
});