Автообновление корзины WooCommerce
Простой сниппет для автоматическоого обновления корзины в WooCommerce при изменении количества товара.
Общий смысл такой: на странице корзины добавляем скрипт в футере сайта, который вешает «слушателя» на поле с количеством товара.
При изменении этого поля делаем програмный клик на кнопку обновления корзины. При этом саму кнопку мы скрываем стилями, чтобы всё было по красоте.
Подключаем скрипт в футер, для чего цепляемся за хук wp_footer в файле functions.php вашей дочерней темы:
add_action(
'wp_footer',
function() {
// Проверяем, что это страница корзины.
if ( ! is_cart() ) {
return;
}
?>
<script>
jQuery( function( $ ) {
var delay;
// Вешаем "слушателя".
$( '.woocommerce' ).on( 'change', 'input.qty', function() {
if ( undefined !== delay ) {
clearTimeout( delay );
}
// Делаем задержку в полсекунды, чтобы не генерить
// лишние запросы на сервер.
delay = setTimeout(
function() {
// Кликаем на кпоку обновления корзины.
$( '[name="update_cart"]' ).trigger( 'click' );
},
500
);
} );
} );
</script>
<style>
/* Прячем кнопку */
.woocommerce [name="update_cart"] {
display: none;
}
</style>
<?php
}
);
А кто минусует пост, не судьба написать в комментах причину? Или религия не позволяет?
не работает, на странице выводится:
jQuery( function( $ ) { ... } );Простите, это у меня в сниппете ошибка была (забыл тег
<script>). Поправил, проверьте.Подскжите как сделать чтоб данный хук работал так же с нажатия на кнопку + или — У меня работает только при вводе через input
Судя по всему, у вас кастомные контролы, тогда просто к ним на
onchange.Стилями вы не полностью удаляете кнопку обновления корзины. Нужно удалить поле ввода
.woocommerce button[name="update_cart"], .woocommerce input[name="update_cart"] { display: none; }Возможно, за 2 года много воды утекло, вука постоянно меняется, ломая обратную совместимость — это нормально. Но и много зависит от темы, которую вы используете. Может оказать так, что ее автор намудрил.