updated_cart_totals trigger not working after empty cart

user_12199362 0
Viewed 764

Currently, I want to change the text inside a div after clicking a update_cart button on the cart page.

Now I use jQuery to trigger an action to make it work.

jQuery( document.body ).on( 'updated_cart_totals', function(){
    var sum = 0;
    jQuery(".qty").each(function(){
        sum += +jQuery(this).val();
    });
        
    if(sum > 0 || sum != ''){   
        jQuery('#text_block-14-124, #text_block-179-47').text(sum);
    }else{
        jQuery('#text_block-14-124, #text_block-179-47').text('0'); // does not run
    }
});

it works like charms, but when I change the quantity to 0 and click the update_cart button and make my cart empty, my script doesn't only run if there is a product on it. I can run a script to change text when clicking the update_cart button and then my cart empty.

I do not use cart fragments to make it works, completely manual code.

woocommerce wordpress jquery
1 Answers

updated_cart_totals only trigger when .woocommerce-cart-form found so when you update quantity 0 cart form removed so in that case you need to use wc_cart_emptied trigger.

function add_custom_js(){
    ?>
    <script type="text/javascript">
        (function($){
            jQuery( document.body ).on( 'updated_cart_totals', function(){
                var sum = 0;
                jQuery(".qty").each(function(){
                    sum += +jQuery(this).val();
                });
                if(sum > 0 || sum != ''){   
                    jQuery('#text_block-14-124, #text_block-179-47').text(sum);
                }else{
                    jQuery('#text_block-14-124, #text_block-179-47').text('0'); // does not run
                }
            });

            jQuery( document.body ).on( 'wc_cart_emptied', function(){
                var sum = 0;
                jQuery(".qty").each(function(){
                    sum += +jQuery(this).val();
                });
                if(sum > 0 || sum != ''){   
                    jQuery('#text_block-14-124, #text_block-179-47').text(sum);
                }else{
                    jQuery('#text_block-14-124, #text_block-179-47').text('0'); // does not run
                }
            });
        })(jQuery);
    </script>
    <?php
}

add_action( 'wp_footer', 'add_custom_js', 10, 1 );

For Reference WooCommerce cart.js. below you can see how and when triggers called.

/**
 * Update the .woocommerce div with a string of HTML.
 *
 * @param {String} html_str The HTML string with which to replace the div.
 * @param {bool} preserve_notices Should notices be kept? False by default.
 */
var update_wc_div = function( html_str, preserve_notices ) {
    var $html       = $.parseHTML( html_str );
    var $new_form   = $( '.woocommerce-cart-form', $html );
    var $new_totals = $( '.cart_totals', $html );
    var $notices    = $( '.woocommerce-error, .woocommerce-message, .woocommerce-info', $html );

    // No form, cannot do this.
    if ( $( '.woocommerce-cart-form' ).length === 0 ) {
        window.location.reload();
        return;
    }

    // Remove errors
    if ( ! preserve_notices ) {
        $( '.woocommerce-error, .woocommerce-message, .woocommerce-info' ).remove();
    }

    if ( $new_form.length === 0 ) {
        // If the checkout is also displayed on this page, trigger reload instead.
        if ( $( '.woocommerce-checkout' ).length ) {
            window.location.reload();
            return;
        }

        // No items to display now! Replace all cart content.
        var $cart_html = $( '.cart-empty', $html ).closest( '.woocommerce' );
        $( '.woocommerce-cart-form__contents' ).closest( '.woocommerce' ).replaceWith( $cart_html );

        // Display errors
        if ( $notices.length > 0 ) {
            show_notice( $notices );
        }

        // Notify plugins that the cart was emptied.
        $( document.body ).trigger( 'wc_cart_emptied' );
    } else {
        // If the checkout is also displayed on this page, trigger update event.
        if ( $( '.woocommerce-checkout' ).length ) {
            $( document.body ).trigger( 'update_checkout' );
        }

        $( '.woocommerce-cart-form' ).replaceWith( $new_form );
        $( '.woocommerce-cart-form' ).find( ':input[name="update_cart"]' ).prop( 'disabled', true ).attr( 'aria-disabled', true );

        if ( $notices.length > 0 ) {
            show_notice( $notices );
        }

        update_cart_totals_div( $new_totals );
    }

    $( document.body ).trigger( 'updated_wc_div' );
};

/**
 * Update the .cart_totals div with a string of html.
 *
 * @param {String} html_str The HTML string with which to replace the div.
 */
var update_cart_totals_div = function( html_str ) {
    $( '.cart_totals' ).replaceWith( html_str );
    $( document.body ).trigger( 'updated_cart_totals' );
};
user_64696450
Related