Bundle Shopping Cart Bug

KRBailey-dev
New Member
2 0 0

Hey guys my Client has a weird bug where If you select products using the color swatch from left to Right the shopping cart will list the items correctly

However if you select your products colors from right to left, the Cart will null the first choice and Duplicate the 2nd choice.

Is the problem in my JavaScript? or in my Liquid code?

 

:Here is my Liquid Code:

<div class="collection-box_prod-container">
{%- assign topNum = 0 -%}
{%- assign bottomNum = 0 -%}
{%- assign playsuitNum = 0 -%}
{% for product in collection.products %}
{% for tag in product.tags %}
{% if tag == 'bodysuit' %}
{%- assign topNum = topNum | plus: 1 -%}
{% elsif tag == 'playsuit' %}
{%- assign playsuitNum = playsuitNum | plus: 1 -%}
{% elsif tag == 'bottoms' %}
{%- assign bottomNum = bottomNum | plus: 1 -%}
{% endif %}
{% endfor %}
{% endfor %}

{%- assign kitNum = 3 -%}
{%- assign extraLeft = kitNum | minus: topNum -%}
<section class="product-grid__container product-grid--extra">
<h3 class="product-grid__section-title">Select <span class="product-grid__num">{{ kitNum }}</span> colors from the following bodysuits, You've Selected: [<span class="product-grid__current-count">0</span>/<span class="product-grid__num">{{ kitNum }}</span>]</h3>
<div class="product-grid size-not-selected product-grid--bundle product-grid--kit" data-error="Please select the colors for the tops" data-current-extra=0 data-extra={{ extraLeft }} data-selected-number={{ kitNum }}>
{% for product in collection.products %}
{% for tag in product.tags %}
{% if tag == 'bodysuit' %}
{% include 'sub-product' with product, kit: true, extra: extraLeft %}
{% endif %}
{% endfor %}
{% endfor %}
</div>
</section>

:Here is my JavaScript for Bundles:

let addToCartBundleButtons = document.querySelectorAll('.add-to-cart--bundle');
if(addToCartBundleButtons.length) {
for(let i = 0; i < addToCartBundleButtons.length; i++) addToCartBundleButtons[i].addEventListener('click', function() {
let bundleSections = document.querySelectorAll('.product-grid--bundle');
let selected_variants = [];

for(let i = 0; i < bundleSections.length; i++) {
if(!isBundleSectionFilled(bundleSections[i])) {
document.querySelector('.bundle-popup-message').innerHTML = bundleSections[i].getAttribute('data-error');
document.querySelector('.bundle-popup-message').classList.add('bundle-popup-message--active');
setTimeout(function() {
document.querySelector('.bundle-popup-message').classList.remove('bundle-popup-message--active');
}, 3000);
bundleSections[i].closest('.product-grid__container').scrollIntoView({behavior: 'smooth'});
return false;
}

let activeSwatchBckp = bundleSections[i].querySelector('.color-swatch--active');
let selectedSwatches = bundleSections[i].querySelectorAll('.product-cell:not(.product-cell--hidden) .color-swatch--selected');
for(let j = 0; j < selectedSwatches.length; j++) {
let qty = selectedSwatches[j].getAttribute('data-quantity');
let s = selectedSwatches[j].closest('.product-cell').querySelector('.product-select');
let rcid = s.options[s.selectedIndex].getAttribute('data-rcid');
let id = selectedSwatches[j].closest('.product-cell').querySelector('.product-select').value;
//let title = selectedSwatches[j].text;
//console.log(s);
//console.log('id, rcid',id, rcid);
//console.log('qty', qty);
selectedSwatches[j].click();
selected_variants.push([id, qty, rcid]);
}
activeSwatchBckp.click();
}

var bundleKey = cyrb53(selected_variants.sort(function(a, b) {
return a[0] + a[1] > b[0] + b[1];
}).join('.'));

let qty = 1;
let qtyEl = document.getElementById('Quantity');
if(qtyEl && !isNaN(Number(qtyEl.value)) && qtyEl.value > 0) qty = Number(qtyEl.value);
let kit = false;
let footer = document.querySelector('.product-grid__footer');
if(footer) {
kit = footer.getAttribute('data-kit');
}
let subscribe = this.classList.contains('add-to-cart--subscribe');

if(subscribe) {
$.ajax({
type: "POST",
dataType: "json",
url: "/cart/clear.js",
success: function() {
addVariantsToCart(selected_variants, qty, bundleKey, true, kit);
}
});
} else addVariantsToCart(selected_variants, qty, bundleKey, false, kit);
});
}



0 Likes