Refresh Mini cart on shipping or payment method change in WooCommerce checkout

user_13607873 0
Viewed 1625

I'm trying to trigger the WooCommerce Mini Cart to update when someone changes the Shipping Method or Payment Method on the Checkout page.

I tried using the following code:

add_action( 'wp_footer', 'custom_minicart_checkout_jqscript' );
function custom_minicart_checkout_jqscript() {
    if ( ! ( is_checkout() && ! is_wc_endpoint_url() ) )
        return; // Only Checkout Page
    ?>
    <script type="text/javascript">
    jQuery( function($){
        $('form.checkout').on('change', 'input', function(){
            $(document.body).trigger('wc_fragment_refresh');
        });
    });
    </script>
    <?php
}

But it displays the previous total instead of the current total when customer make changes on selected Shipping Method or/and Payment Method.

UPDATE I tested the following solution but I'm getting the same result. You can see it on this video (download video to view in high quality). I removed non-essential plugins and clear the functions.php file. It seems possible but for some reason the mini cart update is delayed by the previous total.

checkout woocommerce wordpress php jquery
1 Answers

Try to use the following instead, delegating the change event to document.body and targeting specifically shipping methods and payment methods changes:

add_action('wp_footer', 'minicart_checkout_refresh_script');
function minicart_checkout_refresh_script(){
    if ( is_checkout() && ! is_wc_endpoint_url() ) :
    ?>
    <script type="text/javascript">
    (function($){
        $(document.body).on('change', 'input[name="payment_method"],input[name^="shipping_method"]', function(){
            $(document.body).trigger('update_checkout').trigger('wc_fragment_refresh');
        });
    })(jQuery);
    </script>
    <?php
    endif;
}

Code goes in functions.php file of the active child theme (or active theme). It should better work.

Note: There is not any calculated total in mini cart, but only cart items subtotal… You can see that on WooCommerce default template cart/mini-cart.php file. So there is nothing to be refreshed or updated in default WooCommerce mini cart on checkout page.

user_37307540
Related