Auto trigger Update on quantity change in WooCommerce cart page

Question

I removed the UPDATE button from woocommerce cart and I am trying to get the cart updated on quantity change on both desktop and mobile. The following script makes the job but for some reason it only works once. Hope someone can help, thanks so much!

add_action( 'wp_footer', 'update_cart_qty' ); 
function update_cart_qty() {
   if (is_cart()) {
      ?>
      <script type="text/javascript">
         jQuery('input.qty').change(function(){
            jQuery("[name='update_cart']").trigger("click");
         });
      </script>
      <?php
   }
}

LoicTheAztec LoicTheAztec · Accepted Answer · 2020-10-16T20:27:39

To make it work, you need to delegate the "change" event to the document body, this way:

add_action( 'wp_footer', 'auto_update_cart_on_qty_change' );
function auto_update_cart_on_qty_change() {
    if ( is_cart() ) :
    ?>
    <script type="text/javascript">
    (function($){
        $( document.body ).on( 'change input', 'input.qty', function() {
            $('[name=update_cart]').trigger('click');
        });
    })(jQuery);
    </script>
    <?php
    endif;
}

Code goes in functions.php file of the active child theme (or active theme). Tested and works.

Added also "input" event when customer input a value in the quantity field.

Auto trigger Update on quantity change in WooCommerce cart page

2 Answers