Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
As mentioned in the title I want to update the cart-drawer without refreshing the page just like the normal add does but I'm doing it with the add.js using this lines of code, how can I update the cart drawer? (stock dawn theme, no modifications):
const response = await fetch(window.Shopify.routes.root + 'cart/add.js', {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(products),
});
}
bump
Did you ever find a solution to this?
I never found the solution, I switched the approach since this one didn't work.
$.ajax({
type: 'POST',
url: '/cart/add.js',
data: JSON.stringify(data),
dataType: 'json',
contentType: 'application/json',
success: function(response) {
console.log('Product added to cart:', response);
fetch(`${routes.cart_url}?section_id=cart-drawer`)
.then((response) => response.text())
.then((responseText) => {
const html = new DOMParser().parseFromString(responseText, 'text/html');
const selectors = ['cart-drawer-items', '.cart-drawer__footer'];
for (const selector of selectors) {
const targetElement = document.querySelector(selector);
const sourceElement = html.querySelector(selector);
if (targetElement && sourceElement) {
targetElement.replaceWith(sourceElement);
}
}
})
.catch((e) => {
console.error(e);
});
},
error: function(XMLHttpRequest, textStatus) {
console.error('Error adding product to cart:', textStatus);
}
});
===================================================
[REDACTED]
Great thanks, it worked, i was searching for this from 36 hours.
Hey Community! As we jump into 2025, we want to give a big shout-out to all of you wh...
By JasonH Jan 7, 2025Hey Community! As the holiday season unfolds, we want to extend heartfelt thanks to a...
By JasonH Dec 6, 2024Dropshipping, a high-growth, $226 billion-dollar industry, remains a highly dynamic bus...
By JasonH Nov 27, 2024