快速正文解析器处理表单上的复选框数组

2023-12-06

我有一个带有复选框数组的 HTML 表单(使用[]命名)。我需要能够处理这个express。我在用着正文解析器.

问题是未选中的复选框不会提交值,同时,正文解析器似乎通过简单地将值按索引顺序打包到数组中来消除数组中的“漏洞”,但忽略索引本身。 (更新:实际上看起来像qs是罪魁祸首).

考虑这个完整的示例,它显示一个表单并以所提交数据的 JSON 转储进行响应:

Install:

npm install express body-parser

索引.js:

var express = require("express");
var site = express();

site.use(require("body-parser").urlencoded({extended:true}));

site.get("/", function (req, res) {
    res.sendFile(__dirname + "/test.html");
});

site.post("/form", function (req, res) {
    res.json(req.body);
});

site.listen(8081);

测试.html:

<html>
    <body>
        <form method="post" action="/form">
            <input type="checkbox" name="option[0]" value="1">
            <input type="checkbox" name="option[1]" value="1">
            <input type="checkbox" name="option[2]" value="1"><br>
            <input type="text" name="text[0]"><br>
            <input type="text" name="text[1]"><br>
            <input type="text" name="text[2]"><br>
            <button type="submit">Submit</button>
        </form>
    </body>
</html>

在那个例子中,如果我只检查option[1],我通过检查 Chrome 中的请求来验证索引设置是否正确,正文为:

option[1]:1
text[0]:
text[1]:
text[2]:

然而 body-parser 崩溃了option数组并产生以下内容req.body:

{"option":["1"],"text":["","",""]}

如你看到的,text三者都有,但是option只有一项。同样,如果我要检查option[0] and option[2],请求正文将如下所示:

option[0]:1
option[2]:1
text[0]:
text[1]:
text[2]:

但它会被解析为:

{"option":["1","1"],"text":["","",""]}

我丢失了有关选中哪个复选框的所有信息。

我的问题是,我该怎么做呢? What I want发生的是,例如:

  • With checkbox[1]检查:

    {"option":[null,"1",null],"text":["","",""]}
    
  • With checkbox[0] and checkbox[2]检查:

    {"option":["1",null,"1"],"text":["","",""]}
    

我实际上并没有结婚null and "1",我只需要 false 和 true 。

Also, 重要的是我不要丢失有关有多少个复选框的信息should位于数组中。例如,如果我要给每个复选框一个唯一的值,我想我可以翻译"option":["0","1"]到一个布尔值数组中,除非我会失去该数组大小为 3 的知识(在这种情况下第三个值为 false)——尽管我想我可以添加例如隐藏输入,例如numberOfCheckboxes=3,但是...这种映射很麻烦,如果可能的话我想避免它。


我的方法不需要客户端的 JavaScript。 添加与具有相同名称的复选框一样多的隐藏字段

正文解析器会将检查的项目解析为数组和字符串

I meant

<input type="hidden" name="option[0]" value="0">
<input type="hidden" name="option[1]" value="0">
<input type="hidden" name="option[2]" value="0">
<input type="checkbox" name="option[0]" value="1">
<input type="checkbox" name="option[1]" value="1">
<input type="checkbox" name="option[2]" value="1">

如果您的选项[1]被选中,那么正文解析器将像这样解析它

{option:['0', ['0', '1'], '0']}

这是修改器

req.body.option = req.body.option.map(item => (Array.isArray(item) && item[1]) || null);

所以现在身体将是

{option: [null, '1', null]}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

快速正文解析器处理表单上的复选框数组 的相关文章

随机推荐

  • 运行时在 Eclipse 中查找依赖包

    Eclipse 包 例如 在激活器代码中 如何在运行时找到依赖的 Bundle 实例 我想找到 Eclipse 选择的包来满足依赖关系要求 我不想自己解释清单 一个例子 我想在我当前包所依赖的所有包中找到名为 marker txt 的所有资
  • Javascript:检测设备是否可以拨打电话[重复]

    这个问题在这里已经有答案了 是否可以检测设备是否可以拨打电话 我有一个包含电话号码列表的网页 如果设备可以调用 我想让它们可点击 使用tel 关联 当我在桌面浏览器中单击此类链接时 Firefox 报告 地址不明白 Firefox 不知道如
  • 在发布模式下出错,但在构建模式下不会出错

    我最近在 Visual 2008 中使用 opencv 和 c 做了一个项目 当我在调试模式下构建项目时 我没有遇到任何问题 但是当我在发布模式下构建项目时 我收到以下错误 1 gt test obj error LNK2001 unres
  • 苹果网站推送:推送包签名验证失败,但苹果证书没问题

    我正在尝试使用 Codeigniter 向 Safari 实现 Web 推送通知 我正在遵循苹果指南 我创建了一个库来创建基于此的推送包康纳拉科姆github 项目 这是我的图书馆
  • 禁用 iPhone 截图功能

    我正在为客户开发企业iPhone应用程序 手头的问题是客户信息将显示在手机上 我的客户担心可以使用 iPhone 屏幕捕获功能 主页 电源按钮 捕获信息 然后通过电子邮件发送或从手机同步 有什么办法可以禁用屏幕截图功能吗 这可以通过编程方式
  • 如何从命令行使用 REG_EXPAND_SZ?

    我正在阅读有关修改 Windows 注册表的命令的 Windows 命令行文档 Win F1 特别是 reg add 命令 reg add HKCU testfolder t REG EXPAND SZ v Stokrotka d syst
  • 访问帧内的帧

    好的 情况是这样的 我订阅了一个网站 可以让您添加自己的代码等 他们有一个论坛编辑器 我无法设置皮肤以匹配我的网站 所以我只想更改最内框架的颜色 以下示例中的 doc3 这是基本设置 是的 所有文档都来自同一域 但我只能将代码添加到主文档中
  • C 中将数组和数组指针传递给函数的区别

    C 中的两个函数有什么区别 void f1 double a void f2 double a 如果我要在一个相当长的数组上调用这些函数 这两个函数的行为是否会有所不同 它们会在堆栈上占用更多空间吗 首先 一些标准语 6 7 5 3 Fun
  • 附加到字符串变量[关闭]

    Closed 这个问题不符合堆栈溢出指南 目前不接受答案 如何将单词附加到已填充的带空格的字符串变量中 像这样 var str blah blah blah str blah str and some more blah
  • android: onDraw 被不断调用

    我的自定义按钮有问题 onDraw 被一次又一次地调用 我不明白为什么 public class CircleButton extends Button static final int StateDefault 0 static fina
  • 有没有办法以交互方式关闭 python `Bokeh` 图中的图例

    在散景图中隐藏图例 所以我明白谁可以以编程方式关闭图例Bokeh情节 但我想知道是否有办法以交互方式做到这一点 有时 我在情节图例中有许多项目 并且图例占用了大量空间或空间 我想知道是否有一种方法可以单击图例来隐藏它 或者一些这样的选项 我
  • 如何将 git 与 dropbox 和 U 盘/拇指驱动器一起使用

    由于我对 git 比较陌生 我希望能够快速了解 如何在我的配置中使用 git 背景 我正在写机械工程学士学位论文 并在大学和家里工作 论文本身是一个 docx 文件 不允许 TeX 其中包含一些 xls 文件和子文件夹中的图片 还有一个子文
  • 如果我在不同时间使用同一 Linq 查询的不同字段,实体框架是否会多次查询数据库?

    我尝试了互联网和 SOF 但找不到有用的资源 也许我可能没有使用正确的措辞进行搜索 如果由于这个原因我错过了任何以前的问题 请告诉我 我会删除这个问题 我正在处理一个繁忙的数据库 因此需要向数据库发送较少的查询 如果我从不同级别的代码访问同
  • Google 中的 URL 索引

    我想检查特定的 url 是否已使用 asp net 在 google 中编入索引 谷歌是否提供任何与此相关的api webmethod 如果有人了解此事 请发表评论 Syed 你可以用谷歌搜索一下 网站 www websiteyouwant
  • Numpy ndarray 乘法

    我有两个 3D numpy ndarray A np array 1 1 1 1 1 1 2 2 2 2 2 2 B np array 2 0 0 2 2 2 2 2 I want to create the AB array with e
  • 如何增加 SQL 查询/存储过程的百分比?

    如何增加 SQL 查询 存储过程的百分比 已关闭 已得到解答 尝试这个 如果您只想选择 SELECT ename esalary 1 1 INTO name salary FROM employee WHERE eno 113 如果你想更新
  • C# 中是否有属性可以影响 IntelliSense 如何显示类成员?

    是否有任何 C 属性可以应用于类成员 以更改它们在 IntelliSense 列表中的显示方式 当我构建一个包含许多静态常量的类时 这突然出现在我的脑海中 并且我 简单地说 希望它看起来像 IntelliSense 中的枚举 是的 那很愚蠢
  • 保管箱 jsonp 文件

    我正在尝试使用纯 javascript html 从跨域 具体来说是 dropbox 下载一些数据 div div
  • Presto 构建具有不同数据类型的 JSON 数组

    我的目标是获取 varchar 的 JSON 数组name varcharage 以及一个列表books read 数组 varchar 对于每个id books read有以下格式 book1 book2 给定表示例 id name ag
  • 快速正文解析器处理表单上的复选框数组

    我有一个带有复选框数组的 HTML 表单 使用 命名 我需要能够处理这个express 我在用着正文解析器 问题是未选中的复选框不会提交值 同时 正文解析器似乎通过简单地将值按索引顺序打包到数组中来消除数组中的 漏洞 但忽略索引本身 更新