隐藏WooCommerce结帐字段后,删除所需的验证

时间:2020-10-26 13:51:12

标签: php jquery wordpress woocommerce hook-woocommerce

我有一组结帐字段,其中包含包含3个选项的选择字段。当客户转到WooCommerce结帐页面时,最初我将隐藏字段(billing_address_1,billing_address_2,billing_city_field)。默认情况下,这些字段是必需的。因此,当我尝试基于一个自定义选择选项字段隐藏字段时,并且当用户单击“下订单”按钮时,会抛出所需的验证。

这是我所期望的:

  1. 最初,必填字段对用户隐藏。
  2. 当客户选择默认值以外的下拉列表值(仅上传:选项值)时,必填字段应该可见。

以上操作正常,但问题是即使隐藏了字段仍显示验证错误。

下拉html代码段:

<p class="form-row form-row-wide validate-required thwcfe-input-field-wrapper validate-required woocommerce-validated" id="delivery_mode_field" data-priority="20" data-rules="" data-rules-action="" data-validations="validate-required"><label for="delivery_mode" class="">Delivery Mode&nbsp;<abbr class="required" title="required">*</abbr></label> <span class="woocommerce-input-wrapper"><select name="delivery_mode" id="delivery_mode" class="select thwcfe-input-field thwcfe-price-field thwcfe-price-option-field thwcfe-enhanced-select select2-hidden-accessible enhanced" data-placeholder="Delivery Mode" data-price-label="Delivery Mode" data-taxable="no" data-tax-class="" tabindex="-1" aria-hidden="true">
    <option value="upload only" data-price="100" data-price-type="">
        Upload only - Safe office custody (+₹100.00)
    </option>

    <option value="registered post" data-price="175" data-price-type="">
        Registered India Post (+₹175.00)
    </option>

    <option value="speed post" data-price="200" data-price-type="">
        Speed Post (+₹200.00)
    </option>

    <option value="special courier" data-price="250" data-price-type="">
        Professional Courier (+₹250.00)
    </option>
</select> <span class="select2 select2-container select2-container--default select2-container--below select2-container--focus" dir="ltr" style="width: 576px;"><span class="selection"><span class="select2-selection select2-selection--single" role="combobox" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-delivery_mode-container"><span class="select2-selection__rendered" id="select2-delivery_mode-container" title="Registered India Post (+₹175.00)"><span class="select2-selection__clear">×</span>Registered India Post (+₹175.00)</span> </span></span> </span></span></p>

Billing Street Address html代码段:

<p class="form-row address-field validate-required thwcfe-input-field-wrapper validate-required form-row-wide woocommerce-invalid woocommerce-invalid-required-field" id="billing_address_1_field" data-priority="60" data-rules="" data-rules-action="" data-validations="validate-required">
    <label for="billing_address_1" class="">Street address&nbsp;<abbr class="required" title="required">*</abbr></label>
    <span class="woocommerce-input-wrapper"><input type="text" class="input-text thwcfe-input-field" name="billing_address_1" id="billing_address_1" placeholder="House number and street name" value="" autocomplete="address-line1"></span></p>   

functions.php

add_action( 'woocommerce_after_checkout_form', 'conditionally_hide_show_checkout_field', 9999 );

function conditionally_hide_show_checkout_field() {
   wc_enqueue_js( "
   
      jQuery('#billing_address_1').hide(function(){
        jQuery(this).removeClass('validate-required');
        jQuery(this).removeClass('woocommerce-validated');
      });
      
       jQuery('#delivery_mode').on('change', function() {
          if (jQuery(this).val() !== 'upload only') {
                jQuery('#billing_address_1').show(function() {
                jQuery(this).addClass('validate-required');
              });
           } else {
                jQuery('#billing_address_1').hide(function(){
                jQuery(this).removeClass('validate-required');
                jQuery(this).removeClass('woocommerce-validated');
          });
         }
       });
   ");
}

但是我仍然收到验证错误。如何删除那些验证错误?我试过了,但无法弄清楚。

任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

要从地址字段中删除验证,请在functions.php文件中添加以下代码

// Make address field optional
add_filter( 'woocommerce_default_address_fields' , 'nm_set_address_optional' ,99999 );
function nm_set_address_optional( $b_fields ) {
    $b_fields['address_1']['required'] = false;
    $b_fields['address_2']['required'] = false;
    $b_fields['city']['required'] = false;
    return $b_fields;
}