Event-listener is removing after first click

Hi there,
I’ve create a cart-drawer and cart page in Custom Shopify theme. In my cart-drawer and cart Page I used Increase (plus) and decrease (minus) button for increasing and decreasing the quantity of the cart items. I added event listener in those buttons and Section Rendering API for updating the content.

The issue is that when I increase or decrease the quantity, it works the first time. However, after the dynamic content reloads via the Section Rendering API, the event listeners are removed from the buttons.

What should I do Now ?

You either need to attach an listener to the container that you inject the new content into, and listen to the events and see if they match what you’re clicking. Or re-attach the event listeners once you’ve inserted the new content.

I suggest having a read into Event Delegation.

2 Likes

Thanks Luke, You’re correct. I’ve to attach the event’s to their parents so that if the inner contents changes can’t effect the listeners.

Thanks again :heart:

1 Like