6

I'm trying to display the prices of my products inclusive of GST and have them update automatically when a modifier is changed. I've put the class .store_product_price_inc_tax on a span that holds the price of the product, and it works just fine when products are first loaded into the page. But once more products are bought in using AJAX I'm getting the GST exclusive price.

What JS/Jquery code do I need to add to fire off a call to store.js to set .store_product_price_inc_tax to the correct value when items are loaded in via AJAX?

UPDATED: with code example.

$( document ).ready( function(){
K.init();

$('#more-cards a').live('click', function(eve){
    eve.preventDefault();
    $(this).parent().addClass( "loading" );
    $(this).children().replaceWith("<span>Fetching more goodness…</span>");
    $.ajax({
        url: "/store/fetch",
        type: "GET",
        dataType: "html",
        cache: false,
        success: function(data) {
            displayMore(data);
        }
    });
});
});

K,init(); duplicates a single product multiple times by cloning the product form . Each clone has modifiers and a price associated to it.

  • Can you share some of your code as an example? How are you loading your store items via AJAX? Are you expecting store.js to repopulate your span? – Bryan Dec 6 '12 at 18:57
  • Updated post with code example. Yes, I believe I need to call some function in store.js to repopulate the span with the correct price. – since1976 Dec 6 '12 at 21:35
  • How are you loading the products via ajax? You will notice when you use the product tag, Store spits out some JSON with the product data to your page. This is needed to support the live-price-updating magic. I'm guessing your AJAX pages are missing the JSON product data. Do you have a URL we can look at? – Adrian Macneil Dec 7 '12 at 4:54
  • Yup sure do have a URL. dev.kanvas.co.nz/store/product/instagram-canvas To get the AJAX loaded images hit the load more images link at the bottom. Oh and you will have to login to Instagram to get that working. If you don't have an Instagram acct let me know and I will give you access to one. – since1976 Dec 7 '12 at 5:01
  • Just so you know it is one product, set up in Store, not multiple. I'm appending a timestamp to a radio button to get the correct Instagram image attached as a custom modifier, which adds each to the cart as a separate item. – since1976 Dec 7 '12 at 5:04
3

Posting the solution for future reference here.

There were two parts to this problem. Firstly, it looks like the template partial which was being loaded via ajax had slightly different code than the main template, so for example was using {price} instead of {price_inc_tax}. This caused different price to be displayed for products loaded later on via AJAX.

Secondly, there was an issue with javascript events being bound at page load time, which meant they were not being triggered for products added to the page via AJAX (therefore dynamic css variables weren't being updated). This has been fixed in Store 1.6.2.

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.