Return to previous page

Dynamically updating the cart widget via AJAX

This topic has 13 replies, 3 voices, and was last updated 9 years, 8 months ago ago by Stan Russell

wjnmudie

Participant

March 24, 2015 at 04:21
Hi,

I have tried every way possible to get this done but I just cannot get the answer to it anywhere.

There seems to be an ongoing issue with Woocommerce and page caching. Basically, there are two main issues – pages like cart/checkout etc being cached and the cart widget in header.php being cached. This is not a fault of Woocommerce, themes or anything else. It’s just a fact of life. The caching of certain pages can be turned off on request by the likes of W3TC, but the cart widget being cached seems to remain an ongoing issue.

For reference, here is the PHP cart widget code from the header.php file…
```
<a class="mobile-link" href="<?php echo $woocommerce->cart->get_cart_url(); ?>"></a>
<div id="top-cart" class="shopping-cart-wrapper widget_shopping_cart">
	<?php $cart_widget = new Etheme_WooCommerce_Widget_Cart(); $cart_widget->widget(); ?>
</div>
```
There are noted ways around it, such as late_init etc but all these KILL page caching benefits as it takes so much longer to load the page.

So, I am thinking that the best way around this would be to use AJAX onLoad() to update the cart accordingly, allowing (I assume) the page to load from the static page cache.

Can the 8Theme developers point my in the right direction in terms of how I get this done? I’ve looked through the add-to-cart.js to see how the widget it updated but I can’t see exactly how I can do this. Any advice on how I can do this? Providing I can get the required HTML from the code above via AJAX, writing it to the DOM shoudn’t be an issue.

BTW can the developers tell me where the Etheme_WooCommerce_Widget_Cart() class resides in the file structure? I would assume I can simply create a new PHP file with that class include in it, create a new instance of the class, invoke Etheme_WooCommerce_Widget_Cart::widget to get the HTML, and then use this as the response to the AJAX call to rewrite the code in the #top-cart div.

Any help GREATLY appreciated. I love the Blanco template and the site I have been working on is only being held back now by inability to cache pages without losing the cart widget functionality!

Please help! :o|

Thanks,

JN
#51874 Copied
12 Answers

Robert Hall

Support staff

March 24, 2015 at 09:11

Hello,

You can find this function in \themes\blanco\code\woo.php file on line 21

Regards,
Robert Hall.

#51898 Copied

wjnmudie

Participant

March 24, 2015 at 13:19

Thanks for your response.

Do you have any suggestions for how I could go about tackling this problem such as how I could go about triggering a refresh of the cart and place it in jQuery(window).load(function() {}); ?

#51982 Copied

wjnmudie

Participant

March 24, 2015 at 19:15

When a product is added to the cart, where is the cart update triggered? Or is there a way of conditionally invalidating a page cache when the cart is updated?

#52100 Copied

wjnmudie

Participant

March 25, 2015 at 18:38

Anyone? I would desperately like to have this resolved as it would unquestionably improve the value of the template to those who have purchased it.

Is thee already a JS mechanism built into to the template to directly update the cart widget? If someone can just give me some advice I can look to trying to code this myself.

PLEASE help.

#52374 Copied

wjnmudie

Participant

March 25, 2015 at 20:32

On a technical level, is it possible to have an AJAX function in the header.php file that calls a PHP file, passing along the $woocommerce global as a parameter, with that PHP script including and instantiating the Etheme_WooCommerce_Widget_Cart class, calling Etheme_WooCommerce_Widget_Cart::widget() and using the output from this as the return value for the AJAX call then in turn using a function to take this returned HTML and update the cart widget div accordingly?

If you could let me know if I am on the right path, I will have a crack at coding this myself ASAP.

#52407 Copied

Robert Hall

Support staff

March 25, 2015 at 21:18

Hello,

Please wait a little. We will contact with our developers tomorrow and then answer you.
Sorry for a long delay.

Regards,
Robert Hall.

#52412 Copied

wjnmudie

Participant

March 25, 2015 at 21:28

Thank you for your input, it’s much appreciated. The lack of dynamic cart widgets on themes using Woocommerce has been a thorn in the side of developers for years it seems with everyone trying different workarounds but none of them seem to work. Simply put, if you cache pages, it ruins the functionality of the cart widget. Don’t cache pages, and it badly affected the site performace (my SEO has dropped off since I took page caching off). If 8Theme could create an AJAX workaround for this – especially one that could be used universally across your WordPress/Woocommerce templates – I think it would be a great selling point.

Thanks again and I will wait to hear back!

#52415 Copied

Robert Hall

Support staff

March 26, 2015 at 10:15

Hello,

In general you are on the right way. You need create Ajax call to make widget updated after page load and you need remake widget accordingly. We also took into account your recommendations and we will try to implement it in future updates.

Regards,
Robert Hall.

#52476 Copied

wjnmudie

Participant

March 26, 2015 at 12:49

Thanks, that’s great news.

Out of interest, do you have any idea when the next version of Blanco is due for release? In the meantime, I will attempt to develop the fix myself.

#52520 Copied

Robert Hall

Support staff

March 26, 2015 at 13:22

Hello,

Unfortunately we can’t say the exact release date for the new theme update. But you can monitor here
http://themeforest.net/item/blanco-responsive-wordpress-wooecommerce-theme/2755246

Regards,
Robert Hall.

#52525 Copied

wjnmudie

Participant

March 26, 2015 at 14:17

Thanks again Robert. Excellent service from you guys.

#52539 Copied

Stan Russell

Participant

March 26, 2015 at 14:25

Hello,

you are welcome!

Regards,
Stan Russell.

#52544 Copied
Tagged: ajax, cart, dynamic, json, widget, woocommerce, wordpress
Viewing 13 results - 1 through 13 (of 13 total)

The issue related to '‘Dynamically updating the cart widget via AJAX’' has been successfully resolved, and the topic is now closed for further responses

Dynamically updating the cart widget via AJAX

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection