从 Express.js 应用程序中的 EJS 文件接收复选框信息（取消选中复选框）

Question

我有一个简单的待办事项列表应用程序，它使用 Express.js、EJS 和 Body Parser。这是课程作业。它没有数据库连接，因此任务列表项不会在会话之间保留。作业的目标是练习表单提交和处理从表单收到的信息。

用户可以创建新任务并划掉已完成的任务。她还可以撤消划线。划掉/撤消划掉是通过复选框实现的。当用户更改复选框时，站点会点击

/checkClick

文件中的路线

index.js

：

app.post("/checkClick", (req, res) => {
  //console.log(req);
  console.log("number: " + req.body["number"]);
  console.log(req.body);
  todayTasks[req.body["number"]].done=!(todayTasks[req.body["number"]].done);
  console.log("todayTasks checkClick: ");
  console.log(todayTasks);
  res.render("today.ejs", {
    ttasks: todayTasks
  });
});

以下是

today.ejs

的摘录，其中包含以下形式：

<form action="/checkClick" method="POST">
        <input type="checkbox" id="checkbox" <% if(isChecked) {%> checked <% } %> name="number" value=<%=i%> onChange="this.form.submit()">
         <label for="checkbox"><% if(isChecked) {%> <s> <% } %><%=ttasks[i].taskName%><% if(isChecked) {%> </s> <% } %></label>
</form>   

我的问题是，当我撤消删除（取消选中复选框）时，

app.post()

处理程序不会收到属性

number

。我收到此错误：

TypeError: Cannot read properties of undefined (reading 'done')
    at file:///C:/Users/suvi1/Documents/angela/test_todo/index.js:36:72
    at Layer.handle [as handle_request] (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\route.js:144:13)
    at Route.dispatch (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\route.js:114:3)
    at Layer.handle [as handle_request] (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\layer.js:95:5)
    at C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\index.js:284:15
    at Function.process_params (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\index.js:346:12)
    at next (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\index.js:280:10)
    at serveStatic (C:\Users\suvi1\Documents\angela\test_todo\node_modules\serve-static\index.js:75:16)
    at Layer.handle [as handle_request] (C:\Users\suvi1\Documents\angela\test_todo\node_modules\express\lib\router\layer.js:95:5)

我在

print

中放入了

index.js

语句，我发现

req.body

是空的。划掉项目时不会出现此问题，只有撤消划掉（取消选中复选框）时才会出现此问题！

我根本找不到错误。问题是什么？整个代码位于GitHub。

Answer 1

checkbox 的 MDN 文档比我更清楚地说明了这一点：

注意：如果提交表单时未选中复选框，则名称和值都不会提交到服务器。没有纯 HTML 方法来表示复选框的未选中状态（例如 value=unchecked）。如果您想在未选中时提交复选框的默认值，您可以包含 JavaScript 以在表单中创建一个值，该值指示未选中状态。

所以基本上，当您取消选中该复选框并提交表单时，该复选框不会被提交，因此您面临的“ app.post() 处理程序没有收到属性编号”问题是预期的行为。