Automatically Update Cart Sub Total On Quantity Change WooCommerce

To automatically update the cart in WooCommerce when the quantity of a product is changed, you can use JavaScript/jQuery to handle the quantity change event and make an AJAX request to update the cart contents.


Open the functions.php file using a text editor and add the following code:

* Snippet Name:    To Create custom WooCommerce order status.
* Snippet Author:
add_action( 'wp_footer', 'wpproblog_update_cart_on_quantity_change');
function wpproblog_update_cart_on_quantity_change() { ?>
 jQuery( function( $ ) {
  let timeout;
  $('.woocommerce').on('change', 'input.qty', function(){
   if ( timeout !== undefined ) {
    clearTimeout( timeout );
   timeout = setTimeout(function() {
   }, 1000 ); 
 } );
<?php }

//Now, hide the Update Cart button
add_action( 'wp_head', 'ecommercehints_hide_update_cart_button' );
function ecommercehints_hide_update_cart_button() { ?>
  button[name="update_cart"], input[name="update_cart"] {
   display: none;
<?php }

Save the changes to the functions.php file or your custom plugin file.


This code adds a JavaScript event listener to the .quantity input elements within the cart form. Whenever the quantity value is changed, it makes an AJAX request to the update_cart action, passing the cart item key and the new quantity value. The server-side code handles the update and returns the updated cart contents. The success callback function replaces the cart form contents with the updated HTML.