修改从表中获取值的JSON对象

时间:2016-10-19 03:08:45

标签: javascript jquery html json

我使用以下代码使用JSON对象填充html表 -

html -

<input type="button" value="Generate Table" id="btn" />

<div id="dvTable">
</div>

JS -

$('#btn').click(function () {


    var obj = [{ id: 1, name: "bunny", city: "nyc",userinput:"",iscancelled:"" }, { id: 2, name: "sunny", city: "LA",userinput:"",iscancelled:"" }, { id: 3, name: "chubby", city: "PA",userinput:"",iscancelled:"" }
    , { id: 4, name: "punny", city: "DC",userinput:"",iscancelled:"" }, { id: 5, name: "money", city: "Pen",userinput:"",iscancelled:"" }];

    alert(JSON.stringify(obj));
    var table = document.createElement("table");
    table.border = "1";
    var columnCount = obj[0].length;

    var row = table.insertRow(-1);
    for (var i = 0; i < columnCount; i++) {
        var headerCell = document.createElement("th");
        headerCell.innerHTML = obj[0][i];
        row.appendChild(headerCell);
    }

    $.each(obj, function (i, obj) {
        row = '<tr data-id="' + obj.id + '"><td><input type="checkbox" value=' + obj.id + '></td><td>' + obj.id + '</td><td>' + obj.name + '</td><td>'
            + obj.city + '</td><td><input type="text" id="address" ></td></tr>';

        table.append(row);
    });

    var dvTable = document.getElementById("dvTable");
    dvTable.innerHTML = "";
    dvTable.appendChild(table);



});

为简单起见,我采用了一个小的JSON对象,但通常我有一个非常重的对象。我想获取用户在每个文本框中输入的值并将其保存在&#39; userinput&#39; JSON对象的每个元素的字段。此外,我还想保存if&#39;复选框&#39;是否检查并保存&#39; Y&#39;或者&#39; N&#39;在&#39; iscancelled&#39; JSON对象的字段。

我为此编写了以下代码,但这似乎不起作用。可能是什么问题?

var revArray="";
$("[type='input']").each(function () {
        revArray = $(this).val;
    });

$.each(obj, function (i, obj) {

        for (var i = 0; i < revArray.length; i++) {
            obj.userInput= revArray[i];
        }
if ($("[type='checkbox']:checked"))
            obj.isCancelled = 'Y';
        else
            obj.isCancelled = 'N';
alert(JSON.stringify(obj));

1 个答案:

答案 0 :(得分:1)

所以我最终使用jquery以下列方式完成了访问表格的每一行,然后在该行上找到文本框 -

$('table tr:gt(0)').each(function (i, row) {
            var $row = $(row);
            var val1 = $row.find('input[type="text"]').val();
        });

对于那些面临这样问题的人来说,可以使用它,效果非常好!