如何在 WooCommerce 結賬時根據國家/地區制作所需的自定義字段？

Question

我在結帳頁面 (billing_vat) 中添加了一個自定義字段，當國家/地區設置為愛爾蘭 (IE) 時需要它。

目前，我已更改 label 以表明它與使用 JavaScript 的所有其他字段相同，並已連接到“woocommerce_get_country_locale”以將字段更改為 IE 所需的字段。

add_filter('woocommerce_billing_fields', 'dc_custom_billing_fields', 1000, 1);
function dc_custom_billing_fields( $fields ) {
    $fields['billing_vat'] = array(
        'label'        => 'VAT Number',
        'required'     => false,
        'type'         => 'text',
        'class'        => array( 'form-row-wide' ),
        'priority'     => 35,
    );

    return $fields;
}

add_filter( 'woocommerce_get_country_locale', 'dc_change_locale_field_defaults', 1000, 1 );
function dc_change_locale_field_defaults($countries) {
    $countries['IE']['billing_vat']['required'] = true;

    return $countries;
}

add_action( 'woocommerce_admin_order_data_after_shipping_address', 'dc_display_admin_order_meta', 10, 1 );
function dc_display_admin_order_meta($order) {
    echo '<p><strong>'.__('Billing VAT').':</strong> ' . get_post_meta( $order->get_id(), '_billing_vat', true ) . '</p>';
}

add_action( 'woocommerce_after_order_notes', 'dc_after_checkout_field' );
function dc_after_checkout_field() {
    ?>
    <script>
        (function($) {
            $(document).ready(function (){
                $('#billing_country').on('change',function() {
                    if ($('#billing_country').val() == 'IE') {
                        // Required
                        $('#billing_vat').prop('required', true);
                        $('label[for="billing_vat"] .optional').remove();
                        $('label[for="billing_vat"]').append('<abbr class="required" title="required">*</abbr>');
                    } else {
                        $('#billing_vat').removeProp('required');
                        $('label[for="billing_vat"] .required').remove();
                        $('label[for="billing_vat"]').append('<span class="optional">(optional)</span>');
                    }
                })
            });
        })(jQuery);
    </script>
    <?php
}

但是，當我提交表格時，國家設置為愛爾蘭並且該字段為空，Woo 並沒有說該字段是必需的。

Answer 1

當國家/地區設置為愛爾蘭 (IE) 時，需要自定義字段billing_vat 。

只需將現有代碼替換為：（通過注釋標簽進行解釋，添加到代碼中）

// Add field
function filter_woocommerce_billing_fields( $fields ) {
    $fields['billing_vat'] = array(
        'label'        => 'VAT Number',
        'required'     => false,
        'type'         => 'text',
        'class'        => array( 'form-row-wide' ),
        'priority'     => 35,
    );

    return $fields;
}
add_filter( 'woocommerce_billing_fields', 'filter_woocommerce_billing_fields', 10, 1 );

// Validate
function action_woocommerce_after_checkout_validation( $data, $error ) {
    if ( $data['billing_country'] == 'IE' && empty( $data['billing_vat'] ) ) {
        $error->add( 'validation', 'Required based on country.' );
    }
}
add_action('woocommerce_after_checkout_validation', 'action_woocommerce_after_checkout_validation', 10, 2 );

// jQuery
function action_woocommerce_after_order_notes( $checkout ) {
    ?>
    <script>
        (function($) {
            $(document).ready(function () {
                required_or_optional(); //this calls it on load
                $( '#billing_country' ).change( required_or_optional );

                function required_or_optional() {
                    if ( $( '#billing_country' ).val() == 'IE' ) {
                        // Required
                        $( '#billing_vat' ).prop( 'required', true );
                        $( 'label[for="billing_vat"] .optional' ).remove();
                        $( 'label[for="billing_vat"]' ).append( '<abbr class="required" title="required">*</abbr>' );
                    } else {
                        $( '#billing_vat' ).removeProp( 'required' );
                        $( 'label[for="billing_vat"] .required' ).remove();

                        // Avoid append this multiple times
                        if ( $( 'label[for="billing_vat"] .optional' ).length == 0 ) {
                            $( 'label[for="billing_vat"]' ).append( '<span class="optional">(optional)</span>' );
                        }
                    }
                }
            });
        })(jQuery);
    </script>
    <?php
}
add_action( 'woocommerce_after_order_notes', 'action_woocommerce_after_order_notes', 10, 1 );

// Display on the order edit page (backend)
function action_woocommerce_admin_order_data_after_shipping_address( $order ) {
    if ( $value = $order->get_meta( '_billing_vat' ) ) {
        echo '<p><strong>' . __( 'Billing VAT', 'woocommerce' ) . ':</strong> ' . $value . '</p>';
    }
}
add_action( 'woocommerce_admin_order_data_after_shipping_address', 'action_woocommerce_admin_order_data_after_shipping_address', 10, 1 );

Answer 2

只需將以下代碼片段添加到您現有的代碼片段中，希望您可以完成對愛爾蘭的驗證管理

add_action('woocommerce_checkout_process', 'billing_vat_field_process');
function billing_vat_field_process() {
    // Check if set, if its not set add an error.
    if ( ! $_POST['billing_vat']  && !empty($_POST['billing_country']) && 
    $_POST['billing_country'] == "IE" ){
      wc_add_notice( __( 'Please enter VAT number' ), 'error' );
   }
}