如何在发布之前对表单数据进行分组答案

【问题标题】：How to group form data before posting it如何在发布之前对表单数据进行分组
【发布时间】：2019-09-12 15:42:58
【问题描述】：

我想按我的 div 行将我的数据分组到 JSON 对象中，我不确定是否可以仅使用 HTML，我没有任何前端 javascript 来编辑我发布的数据之前发生。我不确定这是否可能。

我的 HTML：

<form action="/post-data" method="post">
    <div class="form-row">
        <input name="item" type="text">
        <input name="count" type="number">
    </div>
    <div class="form-row">
        <input name="item" type="text">
        <input name="count" type="number">
    </div>
    <button type="submit" >Submit</button>
</form>

我从这个表格收到的数据是：

{ item: [ 'item one', 'item two'], count: [ '12', '123'] }

我想接收的数据：

[
    {
        name: 'item one',
        count: '12'
    }, {
        name: 'item two',
        count: '123'
    }
]

【问题讨论】：

到目前为止你尝试过什么？你被困在哪里了？

标签： javascript html forms express post

【解决方案1】：

你可以在对象结构中做到这一点。用一般的名称分配名称。喜欢：

<form action="/post-data" method="post">
    <div class="form-row">
        <input name="entry1.item" type="text">
        <input name="entry1.count" type="number">
    </div>
    <div class="form-row">
        <input name="entry2.item" type="text">
        <input name="entry2.count" type="number">
    </div>
    <button type="submit" >Submit</button>
</form>

您也可以使用任何框架来保持控制器和视图之间的状态。或者不是从 html 发送表单，而是使用 javascript 和 ajax。

【讨论】：