У меня проблемы с печатью в html массив с объектами json. Исходный код Im, используемый для этого объекта javascrit, который является "корзиной покупок",
var ShoppingCart = {
Id: 1,
ShoppingCartItems: [] //array with json objects
};
И массив в "ShoppinCartItems"
{Id:1,ShoppingCartItems:[{ProductID:"9",Quantity:"2",Price:"68.40",Name:"Cake",Date:"2014-05-30",StoreID:"1",UserID:"1"},{ProductID:"7",Quantity:"1",Price:"11.40",Name:"Donut",Date:"2014-05-30",StoreID:"1",UserID:"1"}]}
(Я не знаю, действительно ли это, потому что im использует пример.)
Таким образом, с помощью этого массива объектов json я хочу отобразить таблицу в html-дисплее в тех значениях, которые группируются по дате. Фактическое использование кода Im заключается в следующем:
$.each(ShoppingCart.ShoppingCartItems, function (i, Productos) {
$(".cart").append("\
<tr style='background-color: #F1F1F1; border-bottom: 3px solid #fff;'>\
<td style='width: 10%;'>" + Number(Productos.Quantity) + "</td>\
<td style='width: 33%'>" + Productos.Name + "</td>\
<td style='width: 33%'>" + (Productos.Date || 'N/A') + "</td>\
<td style='width: 20%'>" + Productos.Price + "</td>\
</tr>");
}); //each
Но, к сожалению, результат будет таким
Qty Name Price
2014-05-30
2 Cake 68
2014-05-30
1 Donut 10 (e.g.)
И я хочу получить результат
Qty Name Price
May 30, 2014
2 Cake 68
1 Donut 10 (e.g.)
---
May 31, 2014
1 Other product 10.00
Я хочу, чтобы продукты были сгруппированы по дате, но я не могу сгруппировать их из массива json каждого продукта, я не знаю, что это за решение, надеюсь кто-то может мне помочь
благодаря
Я думаю, все, что вам нужно сделать, это отсортировать массив по дате, который вы можете добиться так:
data.ShoppingCartItems.sort(function (a, b) {
return new Date(a.Date) - new Date(b.Date);
});
Когда вы приходите в цикл по массиву, держите ссылку на последнюю дату и добавляете дату на вывод, если она отличается.
Этот пример поможет объяснить это лучше.
Похоже, ваша проблема аналогична той, что нашла здесь.
Решение было следующим:
Во-первых, раздельная группировка и агрегация. Давайте объявим прототипную функцию "group by". Требуется другая функция для создания строки "hash" для элемента массива.
Array.prototype.groupBy = function(hash){ var _hash = hash ? hash : function(o){return o;}; var _map = {}; var put = function(map, key, value) { if (!map[_hash(key)]) { map[_hash(key)] = {}; map[_hash(key)].group = []; map[_hash(key)].key = key; } map[_hash(key)].group.push(value); } this.map(function(obj){ put(_map, obj, obj); }); return Object.keys(_map).map(function(key){ return {key: _map[key].key, group: _map[key].group }; }); };
Когда группировка завершена, вы можете агрегировать данные, как вам нужно, в вашем случае
data.groupBy(function(o){ return JSON.stringify({a: o.Phase, b: o.Step}); }) /* aggreagating */ .map(function(el){ var sum = el.group.reduce(function(l,c) { return l + parseInt(c.Value); }, 0); el.key.Value = sum; return el.key; });
В общем, он работает. Я тестировал этот код в консоли Chrome, но не стесняюсь улучшать и находить ошибки;).
Я думаю, это то, что вы ищете.
Здесь у меня есть реализация группировки, которая даст вам массив дат. http://jsfiddle.net/JV499/2/
var ItemsByDate = new Array();
$.each(ShoppingCart.ShoppingCartItems, function (i, Productos) {
var pushNewItem = true;
for (var index = 0; index < ItemsByDate.length; index++)
{
dateGroup = ItemsByDate[index];
if (dateGroup.Date && dateGroup.Date == Productos.Date) {
dateGroup.Items.push(Productos);
pushNewItem = false;
} else {
pushNewItem = true;
}
}
if (pushNewItem) {
ItemsByDate.push({
Date : Productos.Date, Items : [Productos]
});
}
});