update_order_review() закрывает добавленный мною div

На странице woocommerce хотел при выборе типа доставки "Самовывоз" вывести блок с информацией об адресе пункта самовывоза, как доехать и тд. Повесил его на хук after_checkout_billing_form. Получилось примерно так:

add_action('woocommerce_after_checkout_billing_form', 'samovivoz');

function samovivoz() {
    ?>
    <div class="samo-block" id="samo-block">
<div class="samo-map">
        <a href="https://yandex.ru/maps" target="blank" class="samo-href"><img class="samo-img" src="">Посмотреть на карте</a>
</div>
<div class="samo-column">
    <div class="samo-prizyv">Заберите ваш товар уже сегодня!</div>
    <div class="samo-adres">xxx <br>Время работы: 11:00-19:00.</div>
    <div class="samo-metro"><span><img class="metro-icon" src="xxx"></span>xxx</div>
    <div class="samo-bus">xxx</div>
    </div>
</div>

Логика была такая - при нажатии на один из способов доставки вылезает этот блок, при других - пропадает. Также в перспективе я бы хотел скрыть поле "Адрес" на этот случай. Для этого написал функцию на JS.

const samo = document.getElementById('samo-block');

const _button = document.getElementById('shipping_method-x');

const radioButtons = document.querySelectorAll('input[name="shipping_method[0]"]');

function handleRadioClick() {
    if (_button.checked) {
        samo.style.display = "flex";
    } else {
        samo.style.display = "none";
    }
}

radioButtons.forEach(radio => {
  radio.addEventListener('change', handleRadioClick);
});

Но она не работала при клике. Блок висит в статусе display:none, но не появляется. Я в JS профан, думал что проблема в коде - но в CodePen все работает. И при загрузке страницы тоже срабатывает, если до этого выбрать нужный способ доставки. Потом я заметил, что все работает, пока страница грузится, но перестает, как только она загружается.

В итоге я понял, что работать скрипт перестает после того, как прогружается ?wc-ajax=update_order_review. Если постоянно тыкать по кнопкам и не давать ему грузиться, все работает хорошо:) Отключить его нельзя, т.к цена доставки должна обновляться в зависимости от способа. Подскажите пожалуйста, с чем это может быть связано, и как это побороть. Костыли вроде создания копирователя в скрытый блок и вытаскивание инфы из него также не возбраняются:)


Ответы (1 шт):

Автор решения: Vladimir I

Нашел решение. Может, кому будет полезно. Нужно обернуть скрипт в jQuery(document).on( "updated_checkout", function(){} У меня теперь все работает.

→ Ссылка