首页 > 解决方案 > 如何在发布之前对表单数据进行分组

问题描述

我想按我的 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'
    }
]

标签: javascripthtmlformsexpresspost

解决方案


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

<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 而是使用javascriptand发送表单ajax


推荐阅读