chotkos chotkos - 5 months ago 28
HTML Question

How to get total of my cart in Volusion

I am trying to create my own template to Volusion shop. On the masterpage i've got "Total" field which is sum of prices of all products in my cart. How can i get this value in any way? Maybe some javascript?

Answer

Add this to wherever you want the cart total to show.

<div id ="mini_cart_summary"></div>

Assuming you will be using the Volusion soft cart functionality you would need to add the following to your template file or create a separate JavaScript file and call it from your template.

jQuery(function(){
    jQuery.ajax({
        url: '/AjaxCart.asp',
        cache: false,
        dataType: 'json',
        success: function (data) {
            jQuery('#mini_cart_summary').text(data.Totals[0].CartTotal);
        }
    });
});

DisplayCartPopup.prototype.DrawCart = function (CartX, CartY) {
    if (window.hideEditBoundingBox) {
        window.hideEditBoundingBox();
    }
    var instance = this;
    jsonCart = this.data;

    var index = parseInt(jsonCart.Totals[0].LastProduct);
    var quantity;
    var cartTotal;
    var discountTotal;
    var cartLength = 0;
    if (jsonCart != null) {
        cartLength = jsonCart.Products.length;
    }

    quantity = jsonCart.Totals[0].Quantity;
    cartTotal = jsonCart.Totals[0].CartTotal;
    discountTotal = jsonCart.Totals[0].DiscountTotal;

    jQuery("#mini_cart_summary").text(cartTotal);

    var i = 0;
    var cartHTML = '';
    cartHTML += '<div class="soft_add_wrapper">';
    cartHTML += '<div class="soft_add_header_shadow">';
    cartHTML += '<div class="soft_add_header"><span class="soft_add_span">' + PageText_842 + '</span><a href="" class="close_btn" onclick="hideCart(); return false;">Close</a></div></div>'
    cartHTML += '<div class="soft_add_content_shadow"><div class="soft_add_content_wrapper">';
    cartHTML += '<div class="soft_add_content_area">';
    if (!volusion.cart.hasAnchor()) {
        cartHTML += '<table class="cart_table" cellpadding="0" cellspacing="0" border="0">';
        cartHTML += cartLoop(cartLength, false);
        if (cartLength > 0 && discountTotal != "0") {
            var discountProduct = {
                ProductName: "Discount(s)",
                ProductPrice: '<span style="color:red">' + discountTotal + '</span>'
            };
            cartHTML += getLineItemHTML(discountProduct, 0);
        }
        cartHTML += '</table>';
    } else {
        cartHTML += '<ul class="anchored-cart">';
        cartHTML += cartLoop(cartLength, true);
        cartHTML += '</ul>';
    }

    cartHTML += '</div><div class="soft_add_sub_total"><div class="number_of_items">' + quantity + ' ' + PageText_844 + '</div>';
    cartHTML += '<div class="sub_total">';
    cartHTML += PageText_843 + ': <span class="sub_total_amount">' + cartTotal + '</span>';
    cartHTML += '</div>';
    cartHTML += '</div><div class="soft_add_action_area">';
    cartHTML += '<a href="/ShoppingCart.asp" class="check_out"';
    if (typeof (isSocialStore) === "function") {
        cartHTML += ' target="_blank" ';
    } else if (top !== self) {
        cartHTML += ' target="_parent" ';
    }
    cartHTML += '>View Cart</a>';
    cartHTML += '<a href="" class="continue_shopping" onclick="hideCart(); return false;">Continue shopping</a>';
    cartHTML += '</div></div></div></div>';

    if (!cartDiv2) {
        cartDiv2 = document.createElement('div');
        jQuery(cartDiv2).css('visibility', 'hidden').attr('class', 'cartDiv2');
        if (volusion.cart.hasAnchor()) {
            jQuery(volusion.cart.anchor()[0]).append(cartDiv2);
        } else {
            jQuery('body').append(cartDiv2);
        }
    } else {
        cartDiv2.innerHTML = '';
    }
    cartDiv2.innerHTML = cartHTML;
    jQuery('.cartDiv2 .product_name a').each(function (index, element) {
        if (element.textContent) {
            element.innerHTML = element.textContent;
        } else if (element.innerText) {
            element.innerHTML = element.innerText;
        }
        element.innerHTML = element.innerHTML.replace(/<[^>]*>/g, '');
    });

    var $softAddWrapper = jQuery('.soft_add_wrapper');
    if (volusion.cart.hasAnchor()) {
            var $anchor = volusion.cart.anchor();
        $softAddWrapper.addClass('anchored');
        CartX = $anchor.width() - $softAddWrapper.width();
        CartY = $anchor.height();
        $softAddWrapper.css({ left: CartX.toString() + 'px', top: CartY.toString() + 'px' });
    } else {
        if (CartX >= 0 && CartY >= 0) {
             var MaxX = (jQuery(window).width()) - $softAddWrapper.width();
            MaxX += CART_MIN_LEFT;
            MaxX -= CART_PADDING_RIGHT;
            if (CartX > MaxX) {
                CartX = MaxX;
            }

            var MaxY = (jQuery(window).height()) - $softAddWrapper.height();
            if (CartY > MaxY) {
                CartY = MaxY;
            }

            var MinX = CART_MIN_LEFT + CART_PADDING_LEFT;
            var MinY = CART_MIN_TOP + CART_PADDING_TOP;

            if (CartX < CART_MIN_LEFT) {
                CartX = CART_MIN_LEFT;
            } //left
            if (CartY < CART_MIN_TOP) {
                CartY = CART_MIN_TOP;
            } //left
            $softAddWrapper.css({ left: Math.round(CartX).toString() + 'px', top: Math.round(CartY).toString() + 'px' });
        } else {
            $softAddWrapper.css({ left: 50 + '%', top: 140 + 'px' });
            CartX = $softAddWrapper.offset().left;
            CartX -= ($softAddWrapper.width() / 2);
            $softAddWrapper.css({ left: CartX + 'px' });
        }
    }

    if (typeof (softAddOnFirstShowCallback) === "function") {
        softAddOnFirstShowCallback();
    }

    if (typeof (addFacebookLikeDiscountToCart) === "function" && discountTotal == "0" && quantity != "0") {
        addFacebookLikeDiscountToCart();
        DisplayCartPopupBegin('');
        return false;
    }

    window.setTimeout(function () { instance.ResizeImages(); }, 200);
    volusion.cart.itemCount(quantity);
};
Comments