Today’s blog will allow you to have your cart totals automatically update when you modify the amount field without having to click the update button on the cart page.
Remove the WooCommerce Update Cart Button
<?php
add_action( 'wp_head', 'cxc_cart_refresh_update_hide_button' );
function cxc_cart_refresh_update_hide_button() {
?>
<style>
.woocommerce button[name="update_cart"],
.woocommerce input[name="update_cart"] { display: none; }
</style>
<?php
}
?>Automatically WooCommerce Cart when Quantity Changes
Now that the button is hidden, all we need to do is “click” it with JQuery and let WooCommerce handle the rest.
<?php
add_action( 'wp_footer', 'cxc_cart_refresh_update_qty' );
function cxc_cart_refresh_update_qty() {
if ( is_cart() || ( is_cart() && is_checkout() ) ) {
?>
<script>
jQuery( function( $ ) {
let timeout;
jQuery('.woocommerce').on('change', 'input.qty', function(){
if ( timeout !== undefined ) {
clearTimeout( timeout );
}
timeout = setTimeout(function() {
jQuery("[name='update_cart']").trigger("click"); // trigger cart update
}, 1000 ); // 1 second delay, half a second (500) seems comfortable too
});
} );
</script>
<?php
}
}
?>I hope you found this post useful. If you like it, please share it. Please leave a remark if there is an issue. I’ll attempt to figure things out. CodexCoach.
Also Read:
How To Disable Payment Gateways For Specific User Roles in WooCommerce
How to Edit Payment Gateway Title and Description in WooCommerce
How to Create and apply Coupons Programmatically in WooCommerce
FAQ
In WordPress, how do I automatically update my cart?
To use this function, go to Appearance > Customize > WooCommerce > Cart and check the Auto Update box.
How can I add a quantity to my WooCommerce cart?
Navigate to WooCommerce > Settings > Advanced Product Quantity. then go to “Cart Quantities”
