Node Express Jade - 复选框布尔值

Question

我正在使用 Node+Express+Jade 来渲染一些网页。在一个表单上有 2 个复选框。当通过 POST 提交表单时，如果复选框被选中，我得到req.body.checkbox1 -> 'on'，如果没有被选中，我得到req.body.checkbox1 -> undefined

可以将复选框值设为true 或false 吗？

这是我的服务器端测试代码

var bodyParser = require('body-parser');
var express = require('express');

var app = express();
app.use(bodyParser.urlencoded({extended: true}));
app.use(express.static(__dirname + '/webroot'));
app.set('views', __dirname + '/view');
app.set('view engine', 'jade');
app.listen(3001);
app.get('/', function (req, res) {
    res.render('test');
});

app.post('/config', function (req, res) {
    console.log(req.body.t);
    console.log(req.body.f);
    res.redirect('/');
});

还有我的翡翠形态测试

form(action='/config', method='post')
    input(type="checkbox", name="not_checked", checked=false)
    input(type="checkbox", name="checked", checked=true)
    input(type='submit')

Answer 1

我最近正在为一个项目解决这个问题...

这是表格：

form(action='/survey/submission/test/config', method='post')
    input(type="checkbox", name="1")
    input(type="checkbox", name="2")
    input(type="checkbox", name="3")
    input(type="submit")

然后在节点 javascript 中可以通过每个的 req.body.name 找到它们。 如果选中其中一个框，req.body.name 将返回“on”。如果未选中某个框，则它们是未定义的。 因此可以使用三元语句来创建一个新对象并将它们作为布尔值保存到数据库中。

object = {
    first: req.body.1 ? true : false,
    second: req.body.2 ? true : false,
    third: req.body.3 ? true : false
};

希望这可以帮助其他人。弄明白了就开心了

Answer 2

我今天遇到了这个问题，我有一个更干净的解决方案（对我来说）：

function(req, res){
   req.body.field = Boolean(req.body.field)
}

Answer 3

你可以试试下面的玉形

form(action='/survey/submission/test/config', method='post')
  input(type="checkbox", name="not_checked", value="false")
  input(type="checkbox", name="checked", checked, value="true")
  input(type='submit')

该值将是字符串，因此您必须对其进行解析。如果复选框没有选中属性，则它不会包含在发布请求正文中。所以在上面的表格中，只会发送选中的复选框，如下所示。

req.body : {"checked":"true"}

如果您勾选两个复选框，则两个值都将如下发送

req.body : {"not_checked":"false","checked":"true"}

你也可以添加对未定义的验证，只要没有勾选复选框

   if(req.body.not_checked) {
      console.log('not checked : ' + req.body.not_checked);
    }

    if(req.body.checked) {
      console.log('checked : ' + req.body.checked);
    }

Answer 4

我解决了这个问题。首先我只想说我在 NodeJS 上使用了 Jade/pug 模板引擎（+bootstrap 4.1）和 ExpressJS。

div.form-group.form-check
   if customer.status
       input#checkbox.form-check-input(type="checkbox" name="status" value="true" checked)
   else
       input#checkbox.form-check-input(type="checkbox" name="status" value="false")

NodeJS - customer.js

// Update: Update a customer that given id
router.post('/update/:id', (req, res, next) => {

    const customerId = req.params.id;
    // let { name, email, city, country, status } = req.body;

    // Convert value to Boolean
    req.body.status = Boolean(req.body.status); 

    console.log(req.body); // true | false

    Customer.updateOne({ _id: customerId }, req.body).then( /* ... */)

}

另一个简单的例子：

html、jade 或 pug 文件

<input type="checkbox" name="status" value="false" checked>

NodeJS Javascript 文件

app.post('/update/:id', (req, res, next) => {

     // Firstly, we can try it
     console.log(req.body.status); // Output: undefined

     // Then we should convert this value to Boolean
     req.body.status = Boolean(req.body.status);

     console.log(req.body.status) // Output: false or true
}

希望我的解决方案能帮到你

Answer 5

如果您的默认值为 false，那么这个解决方案对我来说似乎是最直接的。 首先使用您的 DB/ORM 设置默认值。 我正在使用 Mongoose，所以在模型文件中它是：

published: { type: Boolean, default: false },

然后在表单输入元素中将值设置为true：

<input type="checkbox" name="published" id="published" value=true>
<label for="published">Publish</label>

通过取消选中它，您将提交一个空值，该值默认为 false。

Answer 6

<form>
    <input type="checkbox" name="imp" value=false>
</form>

let impMarks  ; // 

app.post("/", function(req, res) {
    impMarks =  Boolean(req.body.imp);
    console.log(**impMark**); // the output will be true(if checked) / false 
});