提交动态表输入

时间:2016-06-10 18:15:13

标签: jquery html forms

我想在我的网站上存储一个表数据。该表有n行,每行有m列(它是一个动态表)。每个单元格都有一个输入。所以我们有n * m个输入。

如何以JSON格式存储数据?

Example:
|------------------|------------------|------------------|
| {row-1,column-1} | {row-1,column-2} | {row-1,column-3} |
|------------------|------------------|------------------|
| {row-2,column-1} | {row-2,column-2} | {row-2,column-3} |
|------------------|------------------|------------------|
| {row-3,column-1} | {row-3,column-2} | {row-3,column-3} |
|------------------|------------------|------------------|
| {row-4,column-1} | {row-4,column-2} | {row-4,column-3} |
|------------------|------------------|------------------|

存储数据:

JSON Object:
[
  [ {"row-1,column-1"},{"row-1,column-2"},{"row-1,column-3"} ], // row 1
  [ {"row-2,column-1"},{"row-2,column-2"},{"row-2,column-3"} ], // row 2
  [ {"row-3,column-1"},{"row-3,column-2"},{"row-3,column-3"} ], // row 3
  [ {"row-4,column-1"},{"row-4,column-2"},{"row-4,column-3"} ]  // row 4
]

是否有jQuery解决方案或plugin

1 个答案:

答案 0 :(得分:0)

首先使用tr获取每个each并在其中使用另一个td获取行的事件each()。然后将每个td的文本添加到对象。最后将对象转换为json。



var obj = [];
$("table tr").each(function(index){
    obj[index] = [];
    $(this).find("td").each(function(index2){
        obj[index][index2] = [$(this).text()];
    });
});
var json = JSON.stringify(obj);
console.log(json);

table, tr, td {
    border: 1px solid black;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
    <tr>
        <td>Row1-Column1</td>
        <td>Row1-Column2</td>
        <td>Row1-Column3</td>
    </tr>
    <tr>
        <td>Row2-Column1</td>
        <td>Row2-Column2</td>
        <td>Row2-Column3</td>
    </tr>
    <tr>
        <td>Row3-Column1</td>
        <td>Row3-Column2</td>
        <td>Row3-Column3</td>
    </tr>
</table>
&#13;
&#13;
&#13;