分组 JSON 数据答案

【问题标题】：Grouping JSON DATA分组 JSON 数据
【发布时间】：2012-10-02 20:30:58
【问题描述】：

我是 JSON 架构的新手，在我的代码后面 (ASP.Net 3.5) 中，从 web 方法中，我从数据表返回一个数组，如下所示：

身份证 |数字 ___________ 1 | 200 1 | 300 2 | 400 2 | 500 3 | 600

我将此表以数组形式返回给 JSON 对象。
我想要做的是使用 JQuery 如下构造数据：

<div id="1">ID = 1</div>
    <div id="11">200</div>
    <div id="12">300</div>
</div>
<div id="2">ID = 2</div>
    <div id="21">400</div>
    <div id="22">500</div>
</div>
<div id="3">ID = 3</div>
    <div id="31">600</div>
</div>

【问题讨论】：

标签： c# json jquery

【解决方案1】：

对于渲染本身，我会推荐一个 javascript 模板库，例如 jsRender。至于 JSON 格式，最好的办法是在服务器端对数据进行分组，并让每个属性都包含一个数组，因此您的 JSON 看起来像这样：

var data = {
    "1": ["200", "300"],
    "2": ["400", "500"],
    "3": ["600"]
}

【讨论】：

【解决方案2】：

您应该手动执行此操作，使用对象对您的值进行分组。假设您的 JSON 对象反序列化为：

var myTable = [{ID: 1, Number:200}, {ID: 1, Number:300}, {ID: 2, Number:400}, {ID: 2, Number:500}, {ID: 3, Number:600}]

然后这段代码会将值分组：

var myObject = {};
$.each(myTable, function() {
    if (!myObject[this.ID]) myObject[this.ID] = [];
    myObject[this.ID].push(this.Number);
}

然后你应该构建你的 html 代码结构......类似于：

var myHtml = $("");
$.each(myObject, function(ID, Numbers) {
    if (Numbers) {
        var divId = $("<div></div>").attr("id", ID);
        $.each(Numbers, function(index, number) {
            divId.append($("<div></div>").attr("id", ID.toString() + (index+1).toString()).html(number));
        }
        divId.appendTo(myHtml);
    }
}

请注意，您问题中的 html 无效，它有太多 </div> 结束标签，因此您可以根据需要调整代码。

【讨论】：