使用 NodeJS 从 EJS 中的输入中检索值答案

【问题标题】：Retrieving value from input in EJS with NodeJS使用 NodeJS 从 EJS 中的输入中检索值
【发布时间】：2023-03-26 10:55:01
【问题描述】：

这是我的 EJS 代码：

<form action="/" method="POST">
            <% items.forEach((item)=>{ %>
            <div class="item">
                <input type="checkbox" name="checkbox" value="<%=item._id%>" onchange="this.form.submit()">
                <p><%= item.name %></p>
            </div>
            <% }) %>

</form>

这里是 app.js：

app.post('/',(req,res)=>{
    console.log(req.body.checkbox);
})

我的问题是：

1) 为什么它只记录选中的复选框的值（假设有3个项目）而不是3个值，是因为post方法只发布具有checked属性的复选框的值==真的吗？

2) 如果我添加另一个复选框，如下所示，如果我尝试console.log(req.body.item_id)，为什么它会返回 undefined？

<form action="/" method="POST">
            <% items.forEach((item)=>{ %>
            <div class="item">
                <input type="checkbox" name="checkbox" value="<%=item._id%>" onchange="this.form.submit()">
                <p><%= item.name %></p>
                <input type="checkbox" name="item_id" value="<%=item._id%>">
            </div>
            <% }) %>

</form>

3) 我尝试在上面做同样的事情，但这次使用的是input 类型的text。为什么console.log(req.body.item_id) 显示 3 个值而不是 1（与问题 1 中选中的复选框相对应）？

<form action="/" method="POST">
            <% items.forEach((item)=>{ %>
            <div class="item">
                <input type="checkbox" name="checkbox" value="<%=item._id%>" onchange="this.form.submit()">
                <p><%= item.name %></p>
                <input name="item_id" value="<%=item._id%>">
            </div>
            <% }) %>
</form>

感谢所有回复。谢谢！

【问题讨论】：

1.因为您正在记录 checkbox 值，这是该输入字段的名称。尝试console.log(req.body) 以查看 reqBody 中的所有值并且如果您有两个具有相同名称的复选框并尝试像console.log(req.body.<your check box name here>) 一样记录将记录复选框，如果您检查这些复选框值的两个数组，则会记录该复选框

标签： node.js ejs

【解决方案1】：

这是复选框的默认行为，它只会得到如果检查过，则作为数据传递，如果没有通过，我们可以假设它没有被检查
- 但是，如果您仍然想要数据中的复选框，即使它没有被选中，一个 hack 将是
  - 创建一个与您的复选框同名的隐藏元素并将值设置为“关闭”
  - 提交前，如果勾选复选框，禁用隐藏输入元素
  - 这将使您的复选框值在选中时为“on”，而在未选中时为“off”
如上所述，它只会添加到 formdata 如果它的已选中，未选中时，该元素不会添加到 formdata 完全没有，所以如果不检查，你会得到未定义的
这也是输入类型的默认行为，原因是对复选框不做同样的事情是因为，也许你只是在提交之前选择 1 个具有相同名称的复选框，如果您选择复选框中具有相同名称的多个复选框，您会得到相同的复选框的结果也是如此，但由于首先提到的原因答案，它只会让我们选择你的元素中的 1 案例

【讨论】：