2

我在 jsFiddle 上有以下演示。我想使用 javascript 提交此表单并将 JSON 对象发送回我的控制器。

如您所见，可以将多行添加到表中并提交。在我的 JSON 数据中，我想跟踪哪些复选框被点击了哪些行。例如，基于以下屏幕截图：

在此处输入图像描述

我希望 JSON 对象看起来像这样：

{light:[{red:on}, {yellow:off},{green:on}], dark:[{red:off}, {yellow:off},{green:on}]}...
4

3 回答 3

3

我想出的代码如下所示：

var jsonObject = {};
$('.input-row').each(function(index, row) {
    var innerObject = {};
    $(':checkbox', row).each(function(index, checkbox) {
        innerObject[checkbox.name] = checkbox.checked ? 'on' : 'off';
    });
    var key = $('input[type="text"]', row).val();
    jsonObject[key] = innerObject;
});
console.log(jsonObject);
// use jsonObject somehow

我们正在创建一个空对象，它将作为我们的整个 JSON 对象（称为jsonObject）。

然后我们遍历输入的每一行（我已经input-row向这些行添加了一个类，以便可以轻松地选择它们）。

对于每一行，我们创建另一个空对象（称为innerObject），然后遍历其复选框。对于每个复选框，我们添加一个属性到innerObject：键是name复选框的属性/属性，值是on或off取决于checked状态。最后，我们获取该text行上输入的值以用作 中的键jsonObject，并将属性添加到其中。

这是上述代码的一个工作示例。

于 2013-02-19T15:29:21.930 回答
1

将表单序列化为 JSON 的最简单方法是使用jQuery's serializeArray()

JSON.stringify($('form').serializeArray());
于 2013-02-19T15:17:10.843 回答
0

您应该构建自己的 JSON 字符串，然后使用jQuery.parseJSON()循环表中的所有 tr 元素并收集您需要的信息。

根据 fiddler 中的 html，下面的代码是您的开始。

var strJSON = '';

$("#blacklistgrid tr").each(function (i) { 
    if (i != 0) 
    { 
        var currentRow = $(this)
        strJSON += "{ " + currentRow.find("input[name='shade']").val() +"[{red: currentRow.find("input[name='red']").is(":checked")} ]   }";
    } 
});

var theJSON = jQuery.parseJSON(strJSON);

请检查 JSON 字符串的正确格式，我无法检查代码是否有效，但您可以在此处获取逻辑。

于 2013-02-19T15:34:25.967 回答