Hi, want to share today a piece of JS code.

About the issue:
Once cache is enabled globally on a website with a cart, product pages become cached and therefore cart information is not updated.

We know about the <cms:no_cache /> tag, which is normally placed in cart template( cart.php ) and can disable caching. But we want the cache on product pages, so can't use it here.

As previously discussed in Twitter addon topic http://www.couchcms.com/forum/viewtopic ... =10#p24103 a JS solution is a good way to solve it.


Let's say, a product page has 2 html elements, where we want to display total price of cart and total quantity of all products in it.
CouchCart Sample http://www.couchcms.com/demo/simple/ provides such a place here
Code: Select all
<li class="nav-button">
   <a href="<cms:pp_cart_link />" class="nav cart"><span class="quantity"><cms:pp_count_items /></span> item(s) - $<strong class="price"><cms:number_format "<cms:pp_total />" /></strong></a>
</li>

I'll use this as a sample too. Basically I need to replace cached text inside these 2 elements:
Code: Select all
<span class="quantity" >here goes quantity</span> and <strong class="price">here goes total price</strong>

To do so, I will request in background our never-cached-cart-template cart.php( which has the <cms:no_cache /> tag ).
Once I get the html response from the requested cart.php, I will find required values in it and update text in our 2 elements on a product page.
...
Caveats:

If cache on the website was ever enabled, then after all the editing work, remove all files in directory on server /couch/cache to make sure everything is updated correctly. Visiting as super-admin doesn't reset cache, so make sure it is properly taken care of.