Posted on 28/09/2018 08:28:17
Hey. I thought I had solved this, but for some reason, my template doesn't work properly.
I can add products to the the cart, but the variants are not added? Also, if I add the same product variant twice it will be put on separat orderlines. ? Can you see what I'm doing wrong?
What happens is, I add product A, with variant 1.X and 1.Y, in the cart I now have Product A and Product A, (no variants). If I do the same again, I will have Product A, 4 times (separat orderlines) still no variants.
It's a fairly complex list of products.... 😵 I need to be able to display and add all the different variants at the same time. The list is loaded and prossesed with Ajax.
Link to site, https://egwbp-apw-test.azurewebsites.net/preorder
@{
int userID = int.Parse(GetGlobalValue("Global:Extranet.UserID"));
int productListPageId = GetInteger("Ecom:ProductList:Page.ID");
List<LoopItem> products = GetLoop("Products");
int c = 1;
int rowCounter = 1;
}
@RenderProductFiltersRow()
<div class="col-12">
<hr class="my-2" />
<div class="row">
<form name="multiForm" id="PreorderMultiForm" method="post" action="/default.aspx?ID=@productListPageId">
<input type="hidden" name="CartCmd" id="CartCmd" value="addMulti" />
@foreach (LoopItem p in products)
{
var id = p.GetString("Ecom:Product.ID");
var imageCustom = p.GetString("Product.ImageCustom");
//var allowBuy = p.GetBoolean("Product.AllowBuy");
var isInCart = p.GetBoolean("Ecom:Product.IsInCart");
var languageID = p.GetString("Ecom:Product.LanguageID");
var dbPrice = p.GetDouble("Ecom:Product.Price");
var salesPrice = (dbPrice * 1.25);
var stockNumber = p.GetDouble("Ecom:Product.Stock");
var stockText = p.GetString("Ecom:Product:Stock.Text");
var stockImage = p.GetValue("Ecom:Product:Stock.Image");
var stock = (!string.IsNullOrEmpty(stockText)) ? string.Format("{0} {1}", stockText, stockImage) : string.Format("{0} stk.", stockNumber > 0 ? stockNumber : 0);
var varComb = p.GetLoop("VariantCombinations");
<div class="col-12 m_bottom_10 @(p.GetBoolean("Ecom:Product.IsInCart") ? "in_cart" : string.Empty)" data-productno="@p.GetString("Ecom:Product.Number")">
<div class="row p-2 m-0 p-2 pb-4 bg_color_white">
<div class="col-2">
<img class="img_fit_contain" alt="" height="75" width="75" src='@Ecom.GetImage(imageCustom, height:75, width:75, placeholderText:Translate("Ecom.NoImage", "No image"), placeholderTextSize: 15)'>
</div>
<!--description and price of product-->
<div class="col-8">
<h4 class="fw_medium m_bottom_10">@p.GetString("Ecom:Product.Name")</h4>
<p>
@Translate("Ecom.ProductNumber"): @p.GetString("Ecom:Product.Number")<br /> @salesPrice
@(!string.IsNullOrEmpty(p.GetString("Ecom:Product.ShortDescription")) ? p.GetString("Ecom:Product.ShortDescription") + "<br/>" : string.Empty)
@*@Translate("Ecom.SalesPrice"): @p.GetString("Ecom:Product.Discount.Price.PriceWithoutVATFormatted")<br />
@Translate("Ecom.ListIncl"): @salesPrice.ToString("C")*@
</p>
</div>
<div class="col-12">
@*OK, lets fire this off, Multiform wrapped around a table for each of the variations.
This is a proper Loop Bonanza! Yihaa! *@
@if (varComb.Count > 0)
{
<div class="clearfix m_top_15 bg_color_white">
<table class="variant_table preorder_table w-100">
@*Table head, loop throug the Size variant group, becasue there will allways be sizes as variation... (?) *@
@foreach (LoopItem sizes in p.GetLoop("VariantGroups").Where(x => x.GetString("Ecom:VariantGroup.Name") == "SIZE"))
{
<tr>
<td>@Translate("VariantTableName", "Color/Size")</td>
@foreach (LoopItem size in sizes.GetLoop("VariantAvailableOptions"))
{
<td class="t_align_c">@size.GetString("Ecom:VariantOption.Name")</td>
}
<td class="t_align_c">Sum antall</td>
<td class="t_align_c">Pris</td>
<td class="t_align_c">Sum pris</td>
</tr>
}
@*Then if there is a second varition, eg. Color, we loop throught that group, giving each rows first cell the name of the variation. Then we create the rest of the cells by looping through each size option. We do this for each row of color varition. The input takes a Variant ID made from the rows color ID and the size ID.*@
@if ((p.GetLoop("VariantGroups").Where(x => x.GetString("Ecom:VariantGroup.Name") == "COLOR")).Count() > 0)
{
foreach (LoopItem vgColor in p.GetLoop("VariantGroups").Where(x => x.GetString("Ecom:VariantGroup.Name") == "COLOR"))
{
@*Looping throught the row labels, first cell*@
foreach (LoopItem voColor in vgColor.GetLoop("VariantAvailableOptions"))
{
string rowId = string.Format("colorRow{0}", rowCounter);
<tr id="@rowId">
<th>@voColor.GetString("Ecom:VariantOption.Name")</th>
@*Then we create inputs for all the options. *@
@foreach (LoopItem vgSize in p.GetLoop("VariantGroups").Where(x => x.GetString("Ecom:VariantGroup.Name") == "SIZE"))
{
var price = string.Empty;
var priceClean = string.Empty;
foreach (LoopItem voSize in vgSize.GetLoop("VariantAvailableOptions"))
{
@*NB, what comes first, SIZE OR COLOR*@
var varOptId = string.Format("{1}.{0}", voSize.GetString("Ecom:VariantOption.ID"), voColor.GetString("Ecom:VariantOption.ID"));
var varCombination = varComb.Where(x => x.GetString("Ecom:Product.VariantID") == varOptId);
<td>
@foreach (LoopItem vc in varCombination)
{
price = vc.GetString("Ecom:Product.Price");
priceClean = vc.GetString("Ecom:Product.DBPrice");
<input type="hidden" name="ProductLoopCounter@(c)" id="ProductLoopCounter@(c)" value="@(c)">
<input type="hidden" name="ProductID@(c)" id="ProductID@(c)" value="@p.GetValue("Ecom:Product.ID")" />
<input type="hidden" name="VariantID@(c)" value="@vc.GetString("Ecom:Product.VariantID")" />
<input type="number" class="w-100 t_align_c qty" name="Quantity@(c)" value="" onchange="updateRowQuantity(@rowId)" /> @*@Translate(" Ecom:Product.Delimiter", " stk.")*@
@*<input type="hidden" class="ProductVarPrice" value="@vc.GetValue("Ecom:Product.Price")" />*@
}
</td>
c++;
}
<td class="Quantity"></td>
<td class="Price" data-price="@priceClean">@price</td>
<td class="SumPrice"></td>
rowCounter++;
}
</tr>
}
}
}
else
{
<tr>
<td></td>
@*This is simpler, we just need an input for each size variation.*@
@foreach (var vg in p.GetLoop("VariantGroups"))
{
foreach (LoopItem vo in vg.GetLoop("VariantAvailableOptions"))
{
var varOptId = string.Format("{0}", vo.GetString("Ecom:VariantOption.ID"));
<td>
@foreach (LoopItem vc in varComb.Where(x => x.GetString("Ecom:Product.VariantID") == varOptId))
{
if (vc.GetDouble("Ecom:VariantCombination.Product.Stock") > 0)
{
<input type="hidden" name="ProductLoopCounter@(c)" id="ProductLoopCounter@(c)" value="@(c)">
<input type="hidden" name="ProductID@(c)" id="ProductID@(c)" value="@p.GetValue("Ecom:Product.ID")" />
<input type="hidden" name="VariantID@(c)" value="@varOptId" />
<input type="number" class="" name="Quantity@(c)" value="" /> @Translate(" Ecom:Product.Delimiter", " stk.")
}
else
{
<em>@Translate("Ecom.Product.Stock.Empty", "Tomt på lager")</em>
}
}
</td>
c++;
}
}
</tr>
}
</table>
</div>
}
else
{
}
@*Submit the form, and all is well. You can now ride into the Loopy sunset.*@
</div>
</div>
</div>
<hr class="m-3" />
c++;
}
<div id="afterProducts"></div>
<input type="hidden" name="OrderContext" value="PreOrders" />
<div id="addToPreorderCart" class="fixed-bottom bg_color_white box-shadow">
<div class="container">
<a class="button_type_4 color_dark bg_light_color_1 d_block r_corners tr_delay_hover box_s_none f_left m-2" href="/preordercart">@Translate("Ecom.Preorder.Cart", "Preorder kurv")</a>
<button id="addToPreorderCartSubmit" type="button" class="button_type_3 color_light bg_scheme_color d_block r_corners tr_delay_hover box_s_none f_right m-2"><i class="fa fa-cart-plus m_left_5 m_right_10 f_size_large"></i>@Translate("Ecom.Preorder.Buy.All", "Legg varene i preorder kurven")</button>
</div>
</div>
</form>
</div>
</div>
