这里有一个link https://jsfiddle.net/6xytngz7/到我的小提琴
我有一个根据 Ajax 响应获取的 JSON 动态创建的表。
我的表中有重复的条目。例如xxx,xxx
。
我想将它们分组并像这样<td data-count="some count">xxx</td>
我尝试使用underscore.js
但它似乎打破了rowspan
功能。
我转换了arr
到一个对象中使用_countBy(arr)
我获得了以下格式的对象。
{xxx: 2, zzz: 1}
Question: 怎么修改generateTable()
函数来适应这种变化。我尝试按以下方式修改它
var i=0;
$.each(queryObject,function(key,value){
if(i == 0){
i++;
childrenHtml += ('<td rowspan="1" data-count="'+value+'">' + key + '</td>' + '</tr>');
}
else{
childrenHtml += ('<tr><td rowspan="1" data-count="'+value+'">' + key + '</td>' + '</tr>');
}
});
但行跨度现在似乎是个问题。我该如何修改这个?
您将需要创建这样的函数来转换数据并将其分组:
_.chain(data.result)
.keys()//get all the keys buildname1 buildname2..etc
.flatten()
.each(function(key) {//for each key do a mapping and return a grouping.
data.result[key] = _.chain(data.result[key]).flatten().map(function(d) {
var key = _.chain(d).keys().first().value();
var ob = {};
ob[key] = _.chain(d).values().flatten().groupBy().value();//grouping by value
return ob;
}).value();
}).value();
这会将您的数据集转换为以下格式:
{
"buildname1":[
{
"table1":{
"xxx":[
"xxx"
],
"zzz":[
"zzz",
"zzz"
]
}
},
{
"table2":{
"xxx":[
"xxx"
],
"yyy":[
"yyy"
]
}
}
],
"buildname2":[
{
"table1":{
"xxx":[
"xxx",
"xxx"
],
"zzz":[
"zzz"
]
}
},
{
"table2":{
"xxx":[
"xxx",
"xxx"
]
}
},
{
"table3":{
"xxx":[
"xxx"
],
"yyy":[
"yyy"
]
}
}
]
}
然后,您将需要更改用于制作表格和计算行跨度的业务逻辑。
工作代码here https://jsfiddle.net/cyril123/3n8xv3hL/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)