如何将数据从多个输入字段转换为单个 JSON 对象以进一步将其插入单个 mysql 字段答案

【问题标题】：How to Convert Data From multiple input fields to a single JSON object to further insert it into single mysql field如何将数据从多个输入字段转换为单个 JSON 对象以进一步将其插入单个 mysql 字段
【发布时间】：2019-08-21 17:29:51
【问题描述】：

我正在开发一个表单，用户将在其中插入有关产品的数据。我有一个带有产品名称的 mySql 表，它有 3 列，即 id、product_name 和属性。

现在问题出在属性上，我希望用户能够添加自己的属性和值，例如 Size = 3inche 和 weight=12kgs 等。

我设计了一个如下的表格。

    <form action="" method="post">
        <table>
            <tr><td><label for="">Product Name</label></td><td><input type="text" name="p_name"></td></tr>

        <tr><td><label for="">Attribute</label></td><td><input type="text" name="attributes['attribute']"><br></td></tr>

        <tr><td><label for="">value</label></td><td><input type="text" name="attributes['value']"><br></td></tr>
        <tr><td><label for="">Attribute</label></td><td><input type="text" name="attributes['attribute']"><br></td></tr>

        <tr><td><label for="">value</label></td><td><input type="text" name="attributes['value']"><br></td></tr>
        <tr><td colspan="2" align="center" ><input type="submit" name="submit" value="Submit"></td></tr>



        </table>
    </form>

所以基本上我想要的是$_POST['attributes'] 是返回一个属性数组，我应该能够将其转换为 JSON 对象。 JSON 对象应类似于 {"'attribute'":"Size","'value'":"12" "'attribute'":"Weight","'value'":"10"}。

之后，我会将 JSON 格式的数据插入到 mysql 表的字段属性中。我尝试了很多方法，但我只能检索到最后输入的一个属性。

我能得到一些帮助吗？

【问题讨论】：

标签： php jquery mysql json ajax

【解决方案1】：

虽然也可以在这里形成所需的数据，但是我已经按照当前的要求进行了编码，

这里是代码：

html

<form   action="" method="post">
    <table>
        <tr><td><label for="">Product Name</label></td><td><input type="text" name="p_name"></td></tr>

    <tr><td><label for="">Attribute</label></td><td><input type="text" name="attributes['attribute']"><br></td></tr>

    <tr><td><label for="">value</label></td><td><input type="text" name="attributes['value']"><br></td></tr>
    <tr><td><label for="">Attribute</label></td><td><input type="text" name="attributes['attribute']"><br></td></tr>

    <tr><td><label for="">value</label></td><td><input type="text" name="attributes['value']"><br></td></tr>
    <tr><td colspan="2" align="center" ><input type="submit" name="submits"   value="Submit"></td></tr>



    </table>
</form>

只需将提交按钮名称更改为 submits 即：name="submits"

已添加 jquery

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>

<script>
$("[name='submits']").click((e)=>{
    e.preventDefault();
$("input[type='text']").map(d=>{
    if($($("input[type='text']")[d]).prop('name')!='p_name'){
        $($("input[type='text']")[d]).prop('name',`attributes[${$($("input[type='text']")[d]).val()}]` )
    }
})
$("form").submit();
})
</script>

[d]).prop('name',attributes[${$($("input[type='text']")[d]).val()}])

我使用了模板文字，即：“`”一个反引号

【讨论】：