how to loop and group items that have same id - asp.net-mvc

Question

I need to be able to display each product by id.
For example if I have 3 products with same id: count the quantity and just display it once.
When the id is different display the other product.
product 1 qty 2 price 10 subtotal 20
product 2 qty 1 price 20 subtotal 20
This is the current code.
<div class="yourorder">
#foreach (var group in Model.Products.GroupBy(p => p.ID))
{
foreach (var prod in group)
{
<div data-type="product" data-id="#group.First().ID" data-multiple="#group.First().Multiple" data-multiplecatid="#group.First().MultipleCategoryID" style="overflow:hidden;"></div>
#{Html.RenderAction("ShoppingCartProduct", "ShoppingCart", new { id = group.First().ID });}
</div>
<br />
<hr />
}
}
</div
The proposed solution by Joce gets me the grouped boxes and the quantity. I think I can get quantity using: #group.First().Count - for each box
If a box has the same 5 items, I would like to be able to show the item's unit price, and the subtotal for that box. I know that calculation is unit price * quantity
But I do not know how can I calculate each product sub-total if the price is calculated in another PartialView named "ShoppingCartProduct". This is the line that call that view that calculates the price:
#{Html.RenderAction("ShoppingCartProduct", "ShoppingCart", new { id = group.First().ID});}
The contents of ShoppingCartProduct:
<div class="shoppingCartPrice">
#if (Model.Prod.HasRange && Model.Prod.WeightFrom.HasValue && Model.Prod.WeightTo.HasValue)
{
<div>Price: $#Model.Prod.Price.Value.ToString("0.00")</div>
}
Is it possible that someone can guide me how to get that calculation so my output is:
product 1 qty 2 price 10 subtotal 20 (qty * unit price)
product 2 qty 1 price 20 subtotal 20 (qty * unit price)
Many thanks.

Answer 1

You could use the extension method of IEnumerable GroupBy and then loop in each group.
<div class="yourorder">
#foreach (var group in Model.Products.GroupBy(p => p.ID))
{
foreach (var prod in group)
{
//Calculate subtotal here
}
<div data-type="product" data-id="#group.First().ID" data-multiple="#group.First().Multiple" data-multiplecatid="#group.First().MultipleCategoryID" style="overflow:hidden;"></div>
<br />
<div class="fancyDivider"></div>
}
</div>
Edit:
The function GroupBy group each items that correspond to the grouping. In your example, it's the ID.
That is why you have to:
loop through each group and calculate the subtotal if there is more than
one item in the group
show a div for each group.
To calculate the subtotal, you could simply get the product unit price by getting the first product of the group and mutiply it by the number of product:
var subtotal = group.First().UnitPrice * group.Count()
Now, to be able to calculate the subtotal in your PartialView you need 2 things:
The product
The count of this product
So, you could do something like this:
#{Html.RenderAction("ShoppingCartProduct", "ShoppingCart",
new { id = group.First().ID, Count = group.Count()});}