根據Woocommerce中的送貨方式顯示或隱藏結賬區域3

我試圖隱藏基於送貨方式的結帳字段。根據Woocommerce中的送貨方式顯示或隱藏結賬區域3

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隱藏字段？

來源

2017-10-08 Nikolay Fomin

我試圖找到答案我在搜索的問題，但它不是專門找到。 PickPoint是送貨服務之一。如果你設法隱藏local_pickup的字段，那麼對於pickpoint我可以做類比。通過身份證我一般不會隱藏字段。 ID local_pickup：20 is「shipping_method_0_local_pickup20」 ID wc_custom_shipping_pickpoint is「shipping_method_0_wc_custom_shipping_pickpoint」 –

這是一個關於該問題的問題，但沒有人回答。 https://stackoverflow.com/questions/46195765/hide-woocommerce-checkout-fields-by-shipping-type-selected-on-checkout-page?rq=1 –

你不需要任何Ajax來實現這一點。第一個功能將使所有必要的結帳字段不是「必需的」，因爲這是有條件地顯示/隱藏結賬字段所必需的。第二個功能（主要是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文件或也以任何插件文件。

這是測試和工程上WooCommerce 3+

來源

2017-10-09 13:29:59 LoicTheAztec

根據Woocommerce中的送貨方式顯示或隱藏結賬區域3

回答

相關問題