document.addEventListener("DOMContentLoaded", function () {
const cartItems = document.querySelectorAll('.woocommerce-mini-cart-item');
cartItems.forEach(item => {
const span = item.querySelector('.quantity');
if (!span || span.querySelector('.qty-wrapper')) return;
const removeBtn = item.querySelector('a.remove');
const itemKey = removeBtn?.getAttribute('data-cart_item_key');
if (!itemKey) return;
let rawQty = span.innerText.trim().split('×')[0].trim();
const currentQty = parseInt(rawQty) || 1;
const wrapper = document.createElement('div');
wrapper.className = 'qty-wrapper';
wrapper.style.display = 'flex';
wrapper.style.alignItems = 'center';
wrapper.style.gap = '6px';
const minus = document.createElement('button');
minus.textContent = '−';
minus.style.cssText = 'padding:2px 6px; cursor:pointer;';
const plus = document.createElement('button');
plus.textContent = '+';
plus.style.cssText = 'padding:2px 6px; cursor:pointer;';
const input = document.createElement('input');
input.type = 'number';
input.min = 1;
input.value = currentQty;
input.style.cssText = 'width:60px; text-align:center;';
minus.onclick = () => {
if (input.value > 1) {
input.value--;
updateQty(itemKey, input.value);
}
};
plus.onclick = () => {
input.value++;
updateQty(itemKey, input.value);
};
input.onchange = () => {
if (input.value >= 1) {
updateQty(itemKey, input.value);
}
};
wrapper.appendChild(minus);
wrapper.appendChild(input);
wrapper.appendChild(plus);
span.textContent = '';
span.appendChild(wrapper);
});
function updateQty(itemKey, qty) {
console.log("📦 Sending to admin-ajax:", itemKey, qty);
fetch('/wp-admin/admin-ajax.php', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: new URLSearchParams({
action: 'update_cart_item',
cart_item_key: itemKey,
quantity: qty
})
})
.then(res => res.json())
.then(data => {
if (data.success && data.data && data.data.fragments) {
for (const selector in data.data.fragments) {
const el = document.querySelector(selector);
if (el) el.innerHTML = data.data.fragments[selector];
}
console.log("✅ Cart updated!");
} else {
console.error("❌ Failed to update", data);
alert("AJAX failed. See console for more.");
}
})
.catch(err => {
console.error("❌ JS AJAX ERROR", err);
alert("AJAX failed. See console for more.");
});
}
});
