Udating custom WooCommerce mini cart when cart contents get changed

Question

I have a nice little WooCommerce custom cart working in my theme header (code below). However... when the customer is on the cart page and changes the quantity of items ordered, or removes an item from the cart - the number of items in the cart and price doesn't update until the page reloads... Is there a way to get the AJAX reload that happens when the cart table is updated to also update the custom mini cart in my custom theme header?

<span class="shoppingSummaryBar_Total">
<!-- render value -->
<?php global $woocommerce; ?>
<?php echo $woocommerce->cart->get_cart_total(); ?>
</span>
<span class="shoppingSummaryBar_Items">
<!-- render no of items -->
<?php if ( in_array( 'woocommerce/woocommerce.php', apply_filters( 'active_plugins', get_option( 'active_plugins' ) ) ) ) {

$count = WC()->cart->cart_contents_count;
?><a class="cart-contents" href="<?php echo WC()->cart->get_cart_url(); ?>" title="<?php _e( 'View your shopping cart' ); ?>"><?php 
if ( $count > 0 ) {
    ?>
    <span class="cart-contents-count"><?php echo esc_html( $count ); ?></span>
    <?php
}
    ?>
    Items
    </a>

<?php } ?>
</span>

Answer 1

Try this code inside your functions file:

add_filter( 'woocommerce_add_to_cart_fragments', 'woocommerce_header_add_to_cart_fragment' );

function woocommerce_header_add_to_cart_fragment( $fragments ) {
    global $woocommerce;
    ob_start();
    ?>

    <span class="cart-contents-count"><?php echo $woocommerce->cart->cart_contents_count; ?></span>

    <?php
    $fragments['span.cart-contents-count'] = ob_get_clean();
    return $fragments;
}

Also through $woocommerce->cart you have $woocommerce->cart->get_cart_total(); and many other data. Check here.