How to hide payment block when choosing wordpress pickup?

Question

JavaScript

How to implement such a thing: on the cart page there is a choice of delivery (free delivery and pickup), you need to hide the payment block when choosing pickup further on the checkout page (checkout). I tried this script, but when going to the checkout page, the block was not hidden (it was hidden only after you double-click on the pickup point on this page)

var toggle_status = 1;
jQuery("body").on("click", "input#shipping_method_0_local_pickup3", function () { 	 
 	  setTimeout(function(){
 		  jQuery("input#shipping_method_0_local_pickup3").trigger("click");
 		}, 10000);
       if (toggle_status == 1) {
             jQuery(".wc_payment_methods.payment_methods.methods").hide(100);
             toggle_status = 0;
       } 
       else {
             jQuery(".wc_payment_methods.payment_methods.methods").show(100);
             toggle_status = 1;
       }

I also tried the option to assign the class hidden to the block:

jQuery("body").on("click", "input#shipping_method_0_local_pickup3", function () {
    jQuery(".wc_payment_methods.payment_methods.methods").toggleClass('hidden');
 });

Still the same problem, it is removed only by double clicking.

Answer 1

Hello!
Again, I see no one has suggested a more accurate way, so here are my
5 kopecks!
I checked the code on the storefront theme and everything worked.

add_action( 'wp_footer', 'skryt_block_sposoba_oplaty',9999 );
function skryt_block_sposoba_oplaty() {

  // Создадим переменну со значением выбора способа доставки
  $chosen_shipping_methods = WC()->session->get( 'chosen_shipping_methods' )[0];

  // Проверяем выбран ли по умолчанию т.е. при загрузки страницы "самовывоз"? 
  if ( 0 === strpos( $chosen_shipping_methods, 'local_pickup:3' ) ){
    ?>
    <!-- Если да , то...  -->
    <script type="text/javascript">
      jQuery(document).ready(function($) {
        // Ждём когда на странице закончится Ajax
        $( document ).ajaxStop(function() {
          // После окончания (спустя мгновение) монипулируем DOM-элементами 
          setTimeout(function(){
            // Это наш список с выбором способа оплаты
            var ViborMetodaOplaty = $('div#payment').find('ul.wc_payment_methods') ;
            // Это пункт выбора способа доставки "самовывоз"
            var Samovyvoz = $('input#shipping_method_0_local_pickup3') ;
            // Если НЕ выбран "самовывоз",то...
            if ( ! Samovyvoz.is(':checked')) {
              // то показываем список с выбором способа оплаты
              ViborMetodaOplaty.fadeIn("fast");
              // Если ВЫБРАН "самовывоз",то...
            }else{
              // то через slideUp скрываем список с выбором способа оплаты
              ViborMetodaOplaty.slideUp( "fast", function() {
                ViborMetodaOplaty.fadeOut();
              });
            };
          }, 100);
        });			
      });
    </script>
    <!-- А,что если по умолчанию т.е. при загрузки страницы НЕ ВЫБРАН "самовывоз"?  -->
  <?php }else{
    ?>
    <!-- Если так, то...  -->
    <script type="text/javascript">
      jQuery(document).ready(function($) {					
        // Ждём когда на странице закончится Ajax
        $( document ).ajaxStop(function() {		
          // После окончания (спустя мгновение) монипулируем DOM-элементами				
          setTimeout(function(){
            // Это наш список с выбором способа оплаты
            var ViborMetodaOplaty = $('div#payment').find('ul.wc_payment_methods') ;
            // Это пункт выбора способа доставки "самовывоз"
            var Samovyvoz = $('input#shipping_method_0_local_pickup3') ;
            // Если ВЫБРАН "самовывоз",то...
            if ( Samovyvoz.is(':checked')) {
              // то через slideUp скрываем список с выбором способа оплаты
              ViborMetodaOplaty.slideUp( "fast", function() {
                ViborMetodaOplaty.fadeOut();
              });
              // Если НЕ выбран "самовывоз",то...
            }else{
              // то показываем список с выбором способа оплаты
              ViborMetodaOplaty.fadeIn();
            };
          }, 100);
        });			
      });
    </script>
    <?php
  }
}

Hope it helps!