Carrito de actualización automática al hacer clic en WooCommerce

Quiero actualizar automáticamente el carrito cuando se cambia la cantidad. Tengo este código de trabajo en functions.php, pero solo funciona para el primer clic. ¿Cómo ajustarlo para que funcione con cada clic?

add_action( 'wp_footer', 'cart_update_qty_script' ); 
function cart_update_qty_script() { 
    if (is_cart()) : 
    ?> 
    <script> 
        jQuery('div.woocommerce').on('click', '.quantity .button', function(){ 
            jQuery("[name="update_cart"]").trigger("click"); }); 
    </script> 
    <?php 
    endif; 
}

intentalo asi..

add_action( 'wp_footer', 'cart_update_qty_script' ); 
function cart_update_qty_script() { 
    if (is_cart()) : 
    ?> 
    <script>
    jQuery( 'div.woocommerce' ).on( 'change', '.qty', function () {
    jQuery( "[name="update_cart"]" ).trigger( "click" );
    } );
    </script>
    <?php 
    endif; 
}

Es porque el html está siendo reemplazado, el evento de clic div.woocommerce ya no está allí… si lo adjuntaste al cuerpo, podría funcionar…

La razón por la que esto sucede es porque tu dom se actualiza con el Ajax y los eventos se descargan.

Lo que debe hacer es escuchar el evento ‘updated_cart_totals’ que le indicará que dom está actualizado y luego reactivará a sus oyentes.

function quantity_upd() {
  $(".woocommerce-cart-form").on("change", ".qty", function() {
    $("[name="update_cart"]").removeAttr('disabled');
    $("[name="update_cart"]").trigger("click");
  });
}

$( document ).on( 'updated_cart_totals', function() {
  quantity_upd();
}

Ajústelo para su tema y HTML, puede variar

La razón por la que solo funciona con el primer clic es porque cada vez que actualiza el formulario, se actualiza solo. Así que en lugar de hacer:

jQuery('div.woocommerce').on('click', '.quantity .button', function() {

tienes que cambiar div.woocommerce a document:

jQuery('document').on('click', '.quantity .button', function() {

Puede usar el complemento como se muestra a continuación.

https://wordpress.org/plugins/woo-update-cart-on-quantity-change/

También este complemento está funcionando para usted.

https://wordpress.org/plugins/woocommerce-ajax-cart/

Utilice el complemento para su lado seguro porque el complemento funciona en todas las versiones de wordpress y woocommerce.

O

Puede probar el código personalizado con modificaciones menores como se muestra a continuación.

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
    if (is_cart()) :
        ?>
        <script type="text/javascript">
            jQuery(document).on("click", "div.woocommerce .quantity .button", function(e) {
               jQuery("[name="update_cart"]").trigger("click"); 
            });

OR  
            jQuery("body").on("click", "div.woocommerce .quantity .button", function(e) {
                jQuery("[name="update_cart"]").trigger("click"); 
            });
        </script>
        <?php
    endif;
}

Como no conozco su estructura HTML, construí un jQuery de muestra que funciona en el tema de la tienda.

Aquí hay un código de muestra.

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
    if (is_cart()) :
    ?>
    <script>
        jQuery('div.woocommerce').on('keyup', '.quantity .qty', function(){
            //console.log('clicked');
            jQuery("[name="update_cart"]").trigger("click"); });
    </script>
    <?php
    endif;
}

En lugar de intentar activar el clic, ¿qué tal quitar el atributo “deshabilitado” del botón Actualizar carrito para que el usuario pueda hacer clic en él? La página del carrito ya funciona de esta manera cuando se cambia la cantidad de un artículo, se puede hacer clic en el botón Actualizar carrito.

add_action( 'wp_footer', 'cart_update_qty_script' ); 
function cart_update_qty_script() { 
    if (is_cart()) : 
    ?> 
    <script> 
        jQuery('body').on('click', 'div.woocommerce .quantity .button', function(){ 
            jQuery("[name="update_cart"]").prop("disabled", false);
        }); 
    </script> 
    <?php 
    endif; 
}

El botón de actualización en realidad está deshabilitado cuando se carga la página, por lo que básicamente debe habilitarlo, justo antes de activar el evento de clic.

Usa este código:

add_action( 'wp_footer', 'cart_update_qty_script' );
function cart_update_qty_script() {
  if (is_cart()) :
   ?>
    <script>
        jQuery('div.woocommerce').on('change', '.qty', function(){
           jQuery("[name="update_cart"]").removeAttr('disabled');
           jQuery("[name="update_cart"]").trigger("click"); 
        });
   </script>
<?php
endif;
}