AJAX cart add/update not updating cart items reliably

[shibujoe]

Hello.
I have been trying to add a widget to my shopify store which will add a donation widget to my cart. Currently I am implementing it using React and embedding it in the theme. The issue here is that on sending a POST request to "cart/add.js", the items do not get added to cart reliably every time. It's more like a hit and miss kinda deal right now and I don't understand what's causing this behavior. The expected behavior would be to click the "plant trees" button and it would add the corresponding item to cart if it does not exist, or if it does exist, then the item quantity will change.

You can try it out at the shopify store "https://hemispherestore.myshopify.com/". Add an item to the cart, go to cart page and click on the green button. The add event does not fire reliably. Sometimes it just reloads the page with no real update to the cart.

Thanks in advance. Look forward to hear from you.

[dreambuilder]

Hi @shibujoe ,

Bruno here from the Shopify app Suproof . It's hard to fully debug this issue with current context. However, I will suggest:
1- First, check Chrome dev tools for potential issues (error warnings).
2- Another thing to check there is if when you click the button there is a network call to the backend.
3- Finally, if you are customizing this, sure that you call "preventDefault" from link event handler. It could be that it's not calling that and therefore calling default link action (take user to href page)

The Shopify link is only the initial template from Shopify. I don't see any "trees" there.

Lastly, if you are building a new store  take a look at Suproof. It might help you promoting your products through social proof or engagement

Best,
Bruno

[MS-WEB-DESIGNER]

Hi,

Seems like this feature can be done without a widget. Custom coding will help you.