I have to display phone as required (mandatory) only if a certain country is selected in WooCommerce checkout screen.
What is the validation rule to check the selected country in real time?
I have tried the following code, which is working for making phone non required:
add_filter( 'woocommerce_billing_fields', 'wc_npr_filter_phone', 10, 1 );
function wc_npr_filter_phone( $address_fields ) {
$address_fields['billing_phone']['required'] = false;
return $address_fields;
}
只有在WooCommerce结帐屏幕中选择了某个国家/地区时，才需要显示电话（必填）。
实时检查所选国家/地区的验证规则是什么？
我尝试过以下代码，该代码适用于非手机操作 必需：
add_filter（'woocommerce_billing_fields'，'wc_npr_filter_phone'，10,1）;
function wc_npr_filter_phone（$ address_fields）{
$ address_fields ['billing_phone'] [' required'] = false;
返回$ address_fields;
}
You mostly need to use javascript for real time events or live events on client side… The code below is mostly using jQuery and a bit of PHP, to make the billing phone required only when customer select specific countries:
微信扫一扫// Making the billing phone field not required (by default)
add_filter( 'woocommerce_billing_fields', 'filter_billing_phone_field', 10, 1 );
function filter_billing_phone_field( $fields ) {
$fields['billing_phone']['required'] = false;
return $fields;
}
// Real time country selection actions
add_action( 'woocommerce_after_order_notes', 'custom_checkout_scripts_and_fields', 10, 1 );
function custom_checkout_scripts_and_fields( $checkout ) {
$required = esc_attr__( 'required', 'woocommerce' );
// HERE set the countries codes (2 capital letters) in this array:
$countries = array( 'UK', 'BE', 'GE', 'IT', 'ES' );
// Hidden field for the phone number validation
echo '<input type="hidden" name="billing_phone_check" id="billing_phone_check" value="0">';
$countries_str = "'".implode( "', '", $countries )."'"; // Formatting countries for jQuery
?>
<script type="text/javascript">
(function($){
var required = '<abbr class="required" title="<?php echo $required; ?>">*</abbr>',
countries = [<?php echo $countries_str; ?>],
location = $('#billing_country option:selected').val(),
phoneCheck = 'input#billing_phone_check';
function actionRequire( actionToDo='yes', selector='' ){
if ( actionToDo == 'yes' ) {
$(selector).addClass("validate-required");
$(selector+' label').append(required);
} else {
$(selector).removeClass("validate-required");
$(selector+' label > .required').remove();
}
$(selector).removeClass("woocommerce-validated");
$(selector).removeClass("woocommerce-invalid woocommerce-invalid-required-field");
}
// Default value when loading
actionRequire( 'no','#billing_phone_field' );
if( $.inArray( location, countries ) >= 0 && $(phoneCheck).val() == '0' ){
actionRequire( 'yes','#billing_phone_field' );
$(phoneCheck).val('1');
}
// Live value
$( 'form.checkout' ).on( 'change', '#billing_country', function(){
var location = $('#billing_country option:selected').val();
if ( $.inArray( location, countries ) >= 0 && $(phoneCheck).val() == 0 ) {
actionRequire( 'yes','#billing_phone_field' );
$(phoneCheck).val('1');
} else if ( $(phoneCheck).val() == 1 ) {
actionRequire( 'no','#billing_phone_field' );
$(phoneCheck).val('0');
}
});
})(jQuery);
</script>
<?php
}
// Phone number validation, when it's visible
add_action('woocommerce_checkout_process', 'billing_phone_field_process');
function billing_phone_field_process() {
// Check if set, if its not set add an error.
if ( ! $_POST['billing_phone'] && $_POST['billing_phone_check'] == '1' )
wc_add_notice( __( 'Please enter a number phone.' ), 'error' );
}
Code goes in function.php file of your active child theme (or theme) or also in any plugin file.
Tested and works.
Related (2019): Make Woocommerce checkout phone field optional based on shipping country