Keep Widget Working with AJAX Cart Updates

If your cart contents are re-rendered because of Ajax Cart or some similar reason, this guide will help you.

You need to add the following line of code in your Ajax loaded page where the widget is displayed.

<div id=”birdchime-slots-box” data-watch-ajax=”#element-to-watch” ></div>

Watching a parent element having id as an element-to-watch

Explanation

Here id=birdchime-slots-box is fixed and should not change.

However, you can change element-to-watch based on your website’s structure and functionality.

element-to-watch is the id of the parent element which doesn’t change with the Ajax or dynamic content.

Similarly, you can watch for an element having class as element-to-watch using the following snippet.

<div id=”birdchime-slots-box” data-watch-ajax=”.element-to-watch” ></div>

Watching a parent element having class as element-to-watch

Related Articles

• How to Fix Widget Loading Issues in Dynamic Carts — Reinitialize the widget when cart content changes dynamically
• Widget Placement: Manual (CSS) — Position the widget using CSS selectors