Update details in cart widget without loading page by using ajax in Woocommerce

4 Views

I am developing a woocommerce widget which will show cart subtotal, cart total, cart items, and shipping total its working fine but what I want to do is to update shipping total as well as cart total whenever I toggle between shipping methods with use of ajax. Currently it updates itself only after page reload. Is there any hook available for this purpose ?

Post Views: 4

Related posts

Leave a Reply

2 comments

  1. You can do this with the add_to_cart_fragments filter.

    My implementation only updates the number of items shown with AJAX but it can be used to update totals, etc as well. This is the normal code in the template that displays the cart details:

    <a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>">
(<?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count); ?>)</a>

    This is the filter added in functions.php:

    // Update items in cart via AJAX
add_filter('add_to_cart_fragments', 'woo_add_to_cart_ajax');
function woo_add_to_cart_ajax( $fragments ) {
    global $woocommerce;
    ob_start();
    ?>
        <a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>">(<?php echo sprintf(_n('%d item', '%d items', $woocommerce->cart->cart_contents_count, 'woothemes'), $woocommerce->cart->cart_contents_count); ?>)</a>
    <?php
    $fragments['a.cart-contents'] = ob_get_clean();
    return $fragments;
}

    There are definitely some resources / documentation on this out there – I remember using some for reference when I wrote this code but they are a bit tough to google for.

  2. For anyone else wondering about this, there is official documentation on the WooThemes site HERE. Apologies for not being able to post this in a comment, I don’t have enough reputation points.

    The code seems to have been updated though. They now use get_cart_contents_count() instead of cart_contents_count, amongst other things.

    Here are the newer code snippets, copied directly from the WooThemes documentation (you can obviously edit the code to display whatever cart information you like, but make sure you make the same edits in both snippets):

    To display the cart contents and total in your template use something like:

    <a class="cart-contents" href="<?php echo WC()->cart->get_cart_url(); ?>" title="<?php _e( 'View your shopping cart' ); ?>"><?php echo sprintf (_n( '%d item', '%d items', WC()->cart->get_cart_contents_count() ), WC()->cart->get_cart_contents_count() ); ?> - <?php echo WC()->cart->get_cart_total(); ?></a>

    To ajaxify your cart viewer so it updates when an item is added (via ajax) use:

    <?php
// Ensure cart contents update when products are added to the cart via AJAX (place the following in functions.php)
add_filter( 'woocommerce_add_to_cart_fragments', 'woocommerce_header_add_to_cart_fragment' );
function woocommerce_header_add_to_cart_fragment( $fragments ) {
    ob_start();
    ?>
    <a class="cart-contents" href="<?php echo WC()->cart->get_cart_url(); ?>" title="<?php _e( 'View your shopping cart' ); ?>"><?php echo sprintf (_n( '%d item', '%d items', WC()->cart->get_cart_contents_count() ), WC()->cart->get_cart_contents_count() ); ?> - <?php echo WC()->cart->get_cart_total(); ?></a> 
    <?php

    $fragments['a.cart-contents'] = ob_get_clean();

    return $fragments;
}