Woocommerce 3の配送方法に基づいてチェックアウト項目を表示または非表示3

Question

配送方法に基づいてチェックアウト項目を非表示にしようとしています。

function premove_billing_checkout_fields($fields) { 
    global $woocommerce; 
    $chosen_methods = WC()->session->get('chosen_shipping_methods'); 
    $chosen_shipping = $chosen_methods[0]; 

    if($chosen_shipping === 'local_pickup:20') { 
     unset($fields['billing']['billing_postcode']); 
     unset($fields['billing']['billing_state']); 
     unset($fields['billing']['billing_country']); 
    } 

    if($chosen_shipping === 'wc_custom_shipping_pickpoint') { 
     unset($fields['billing']['billing_postcode']); 
     unset($fields['billing']['billing_address_1']); 
     unset($fields['billing']['billing_state']); 
    } 
    return $fields; 
} 
add_filter('woocommerce_checkout_fields', 
'premove_billing_checkout_fields', 990); 

このコードは機能していますが、ページを更新するために必要なフィールドを非表示にするためです。 Ajaxを使用してフィールドを非表示にするにはどうすればいいですか？

Answer 1

これを達成するためにAjaxは必要ありません。最初の関数は、チェックアウトフィールドを条件付きで表示/非表示にするために必要なすべてのチェックアウトフィールドを「必須」にしません。 2番目の関数（主にjQuery）は、選択した配送方法に応じて、希望のフィールドを表示/非表示にします。ここで

はコードです：

// Make some checkout fields not required (mandatory to show/hide fields) 
add_filter('woocommerce_default_address_fields', 'custom_default_checkout_fields', 10, 1); 
function custom_default_checkout_fields($address_fields) { 
    $custom_fields = array('country', 'address_1', 'address_2', 'state', 'postcode'); 
    foreach($custom_fields as $field) 
     $address_fields[$field]['required'] = false; 
    return $address_fields; 
} 

// Conditional Show hide checkout fields based on chosen shipping methods 
add_action('wp_footer', 'custom_checkout_field_script'); 
function custom_checkout_field_script() { 

    // HERE your shipping methods rate IDs 
    $local_pickup = 'local_pickup:20'; 
    $pickpoint = 'wc_custom_shipping_pickpoint'; 

    $required = esc_attr__('required', 'woocommerce'); 
    ?> 
    <script> 
     jQuery(function($){ 

      var shippingMethod = $('input[name^="shipping_method"]:checked'), // Choosen shipping method slug 
       required = '<abbr class="required" title="<?php echo $required; ?>">*</abbr>', // Required html 
       shippingChecked = $('input#ship-to-different-address-checkbox'); 

      // Custom function to show/hide fields 
      shippingChecked.change(function(){ 
       console.log('Shipping Checked: '+shippingChecked.prop('checked')); 
      }); 

      // Function that shows or hide imput select fields 
      function showHide(actionToDo='show', selector=''){ 
       if(actionToDo == 'show') 
        $(selector).show(function(){ 
         $(this).addClass("validate-required"); 
         $(this).removeClass("woocommerce-validated"); 
         $(this).removeClass("woocommerce-invalid woocommerce-invalid-required-field"); 
         if($(selector+' > label > abbr').html() == undefined) 
          $(selector+' label').append(required); 
        }); 
       else 
        $(selector).hide(function(){ 
         $(this).removeClass("validate-required"); 
         $(this).removeClass("woocommerce-validated"); 
         $(this).removeClass("woocommerce-invalid woocommerce-invalid-required-field"); 
         if($(selector+' > label > abbr').html() != undefined) 
          $(selector+' label > .required').remove(); 
        }); 
      } 

      // Initializing at start (Based on the chosen shipping method) 
      if(shippingMethod.val() == '<?php echo $pickpoint; ?>') // Chosen "Pick point" (Hiding "Delivery") 
      { 
       showHide('show','#billing_country_field'); 
       showHide('hide','#billing_address_1_field'); 
       showHide('hide','#billing_address_2_field'); 
       showHide('hide','#billing_postcode_field'); 
       showHide('hide','#billing_state_field'); 
      } 
      else if(shippingMethod.val() == '<?php echo $local_pickup; ?>') // Choosen "Local pickup" (Hidding "Take away") 
      { 
       showHide('show','#billing_address_1_field'); 
       showHide('show','#billing_address_2_field'); 
       showHide('hide','#billing_postcode_field'); 
       showHide('hide','#billing_state_field'); 
       showHide('hide','#billing_country_field'); 
      } 

      // When shipping method is changed (Live event) 
      $('form.checkout').on('change', 'input[name^="shipping_method"]', function() { 
       var shipMethod = $('input[name^="shipping_method"]:checked'); 
       if(shipMethod.val() == '<?php echo $pickpoint; ?>') 
       { 
        showHide('show','#billing_country_field'); 
        showHide('hide','#billing_address_1_field'); 
        showHide('hide','#billing_address_2_field'); 
        showHide('hide','#billing_postcode_field'); 
        showHide('hide','#billing_state_field'); 
       } 
       else if(shipMethod.val() == '<?php echo $local_pickup; ?>') 
       { 
        showHide('show','#billing_address_1_field'); 
        showHide('show','#billing_address_2_field'); 
        showHide('hide','#billing_postcode_field'); 
        showHide('hide','#billing_state_field'); 
        showHide('hide','#billing_country_field'); 
       } 
       else 
       { 
        showHide('show','#billing_address_1_field'); 
        showHide('show','#billing_address_2_field'); 
        showHide('show','#billing_postcode_field'); 
        showHide('show','#billing_state_field'); 
        showHide('show','#billing_country_field'); 
       } 
      }); 

      // When "shipping to different address" is changed (Live event) 
      $('input#ship-to-different-address-checkbox').click(function() { 
       var shipMethod = $('input[name^="shipping_method"]:checked'); 
       if(shipMethod.val() == '<?php echo $pickpoint; ?>' && shippingChecked.prop('checked') == true) 
       { 
        showHide('show','#billing_country_field'); 
        showHide('hide','#billing_address_1_field'); 
        showHide('hide','#billing_address_2_field'); 
        showHide('hide','#billing_postcode_field'); 
        showHide('hide','#billing_state_field'); 

        showHide('show','#shipping_country_field'); 
        showHide('hide','#shipping_address_1_field'); 
        showHide('hide','#shipping_address_2_field'); 
        showHide('hide','#shipping_postcode_field'); 
        showHide('hide','#shipping_state_field'); 
       } 
       else if(shipMethod.val() == '<?php echo $local_pickup; ?>' && shippingChecked.prop('checked') == true) 
       { 
        showHide('show','#billing_address_1_field'); 
        showHide('show','#billing_address_2_field'); 
        showHide('hide','#billing_postcode_field'); 
        showHide('hide','#billing_state_field'); 
        showHide('hide','#billing_country_field'); 

        showHide('show','#shipping_address_1_field'); 
        showHide('show','#shipping_address_2_field'); 
        showHide('hide','#shipping_postcode_field'); 
        showHide('hide','#shipping_state_field'); 
        showHide('hide','#shipping_country_field'); 
       } 
       else if(shippingChecked.prop('checked') == false) 
       { 
        showHide('show','#shipping_address_1_field'); 
        showHide('show','#shipping_address_2_field'); 
        showHide('hide','#shipping_postcode_field'); 
        showHide('hide','#shipping_state_field'); 
        showHide('hide','#shipping_country_field'); 
       } 
      }); 
     }); 
    </script> 
    <?php 
} 

コードは、任意のプラグインファイルでも、あなたのアクティブな子テーマ（またはテーマ）のfunction.phpファイルになりますか。

これはテストの結果、私は検索で私の質問への答えを見つけることを試みたが、それは特にありませんでした