[WooCommerce] Cập nhật giỏ hàng tự động khi thay đổi số lượng sản phẩm

Mặc định WooCommerce không cập nhật giỏ hàng khi bạn thay đổi số lượng sản phẩm trên giỏ hàng WooCommerce. Sử dụng nút cộng/trừ số lượng cho mỗi sản phẩm bạn có thêm vào giỏ hàng và để cập nhật mới giỏ hàng bạn cần nhấn nút cập nhật bên cạnh giỏ hàng. Tuy nhiên, nhiều bạn muốn cập nhật giỏ hàng động ngay sau khi khách hàng thêm hoặc bớt số lượng sản phẩm trên trang giỏ hàng. Trong bài viết này mình sẽ hướng dẫn các bạn làm sao để cập nhật giỏ hàng mà không cần nhấn nút cập nhật.

Có 2 cách là:

+ Cách 1: Chèn code trực tiếp vào file funtion.php

// tự động update số lượng ở trang giỏ hàng
add_action('wp_footer', 'bbloomer_cart_refresh_update_qty');
function bbloomer_cart_refresh_update_qty() {
    if (is_cart()) {
        ?>
        <script type="text/javascript">
        jQuery(function($) {
            $('div.woocommerce').on('change', 'input.qty', function(){
                $("[name='update_cart']").trigger("click");
            });
        });
        </script>
        <?php
    }
}

Cách 2: Nếu bạn muốn chèn trực tiếp code vào Bricks builder thì đầu tiên kéo thả Element “Code”

Sau đó paste code vào ô Javascript

jQuery(function($) {
    $('div.woocommerce').on('change', '.qty', function() {
        let $form = $(this).closest('form');
        $form.find('button[name="update_cart"]').prop('disabled', false).trigger('click');
    });
});

Oke, vậy là xong!