在WooCommerce中添加自定义注册字段和电话字段验证问题 [英] Add Custom registration fields in WooCommerce and phone field validation issue

问题描述

之前曾问过类似的问题，我尝试了所有解决方案，但由于某些原因，它们对我不起作用.

Similar questions have been asked before and I tried all the solutions but for some reason they won't work for me.

我的网站页脚中包含一个迷你的Woocommerce注册字段，以便人们可以轻松注册.电话字段是必填字段，但我想为其设置最小长度，以减少输入假号码的人数.

I have a mini Woocommerce registration field included in the footer of my site so that people can register easily. The phone field is required but I want to set a minimum length to it to reduce the number of people entering fake numbers.

我在我的functions.php中添加了以下代码，(我包含了对表单的所有通知，以便您可以更好地理解)占位符，并且一切正常，但是我无法获得最小长度(使用样式"自定义属性)起作用.

I have the following codes added to my functions.php, (I'm including all the notifications to the form so that you can understand better) the placeholder and everything works but I can't get the minimum length (set using "pattern" custom attribute) to work.

如果有人可以帮助我修复它，将不胜感激.

If anyone can help me fix it, it'd be very much appreciated.

此表单包含在我的网站的页脚中: wondercatspopup.com

This form is included in the footer of my web site: wondercatspopup.com

我添加的代码是:

 add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
    function custom_override_checkout_fields( $fields )
    {        

    $fields['billing']['billing_phone']['custom_attributes'] = array( "pattern" => ".{10,10}" );
         return $fields;    
    }

这是其余的function.php:

And this is the rest of the functions.php:

/**
 * To add WooCommerce registration form custom fields.
 */

function text_domain_woo_reg_form_fields() {
    ?>
   <div class="formumuz" style="display:flex;"> <p class="form-row form-row-first">
        <label style="display:none!important;" for="billing_first_name"><?php _e('First name', 'woocommerce'); ?><span class="required">*</span></label>
        <input style="width: 130px;
    display: inline-block; margin-right:1px;" type="text" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="İsim / Name *" type="text" class="input-text" name="billing_first_name" id="billing_first_name" value="<?php if (!empty($_POST['billing_first_name'])) esc_attr_e($_POST['billing_first_name']); ?>" />


        <label style="display:none!important;" for="billing_last_name"><?php _e('Last name', 'woocommerce'); ?><span class="required">*</span></label>
        <input style="width: 130px;
    display: inline-block; margin-left:1px;" type="text" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="Soyisim / Surname *" type="text" class="input-text" name="billing_last_name" id="billing_last_name" value="<?php if (!empty($_POST['billing_last_name'])) esc_attr_e($_POST['billing_last_name']); ?>" />
    </p></div>

     <p style="margin-bottom: 0px; margin-top: 10px;" class="form-row form-row-wide">

          <label style="display:none!important;" for="reg_billing_phone"><?php _e( 'Phone', 'woocommerce' ); ?></label>
          <input style="width:254px!important;" type="text" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="Cep Telefonu / Mobile *" value="+905" name="billing_phone" id="reg_billing_phone" value="<?php esc_attr_e( $_POST['billing_phone'] ); ?>" /> *
      </p><br>

    <div class="clear"></div>
    <?php
}

add_action('woocommerce_register_form_start', 'text_domain_woo_reg_form_fields');


/**
 * To validate WooCommerce registration form custom fields.
 */
function text_domain_woo_validate_reg_form_fields($username, $email, $validation_errors) {
    if (isset($_POST['billing_first_name']) && empty($_POST['billing_first_name'])) {
        $validation_errors->add('billing_first_name_error', __('İsim alanı zorunludur! / Name field is required!', 'woocommerce'));
    }

    if (isset($_POST['billing_last_name']) && empty($_POST['billing_last_name'])) {
        $validation_errors->add('billing_last_name_error', __('Soyisim alanı zorunludur! / Surname field is required!', 'woocommerce'));
    }

     if (isset($_POST['billing_phone']) && empty($_POST['billing_phone'])) {
        $validation_errors->add('billing_phone_error', __('Telefon alanı zorunludur! / Phone field is required!', 'woocommerce'));
    }


    return $validation_errors;
}




add_action('woocommerce_register_post', 'text_domain_woo_validate_reg_form_fields', 10, 3);

/**
 * To save WooCommerce registration form custom fields.
 */
function text_domain_woo_save_reg_form_fields($customer_id) {
    //First name field
    if (isset($_POST['billing_first_name'])) {
        update_user_meta($customer_id, 'first_name', sanitize_text_field($_POST['billing_first_name']));
        update_user_meta($customer_id, 'billing_first_name', sanitize_text_field($_POST['billing_first_name']));
    }
    //Last name field
    if (isset($_POST['billing_last_name'])) {
        update_user_meta($customer_id, 'last_name', sanitize_text_field($_POST['billing_last_name']));
        update_user_meta($customer_id, 'billing_last_name', sanitize_text_field($_POST['billing_last_name']));
    }
     //Phone field
    if (isset($_POST['billing_phone'])) {
        update_user_meta($customer_id, 'phone', sanitize_text_field($_POST['billing_phone']));
        update_user_meta($customer_id, 'billing_phone', sanitize_text_field($_POST['billing_phone']));
    }


}

推荐答案

注意:页脚中的特殊注册表格与WooCommerce结帐字段有所不同.

Note: Your special registration form located in the footer is something different than WooCommerce checkout fields.

在您的代码中，只是缺少验证函数text_domain_woo_validate_reg_form_fields()的钩子.还有一些小错误(已更正)…

In your code the hook for your validating function text_domain_woo_validate_reg_form_fields() is just missing. There is also some small errors (corrected)…

检查提交的数据的最佳位置是您的验证功能，并且您还还需要添加另一个用于结帐的功能 (而不是使用用于结帐电话字段的自定义模式来格式化数据).

因此，所有相关代码应为:

So all your related code should be:

## --- FOR CHECKOUT --- ##

// Checkout billing phone validation (Checking length)
add_action('woocommerce_checkout_process', 'my_custom_checkout_field_process');
function my_custom_checkout_field_process() {
    if ( $_POST['billing_phone'] && strlen($_POST['billing_phone']) < 10 )
        wc_add_notice( __('Please type a correct phone number…', 'woocommerce'), 'error' );
}

## --- FOR CUSTOM REGISTRATION FORM --- ##

// Add custom fields to registration form.
add_action('woocommerce_register_form_start', 'text_domain_woo_reg_form_fields');
function text_domain_woo_reg_form_fields() {
    ?>
    <div class="formumuz" style="display:flex;">
        <p class="form-row form-row-first">
            <label style="display:none!important;" for="billing_first_name"><?php _e('First name', 'woocommerce'); ?><span class="required">*</span></label>
            <input style="width: 130px; display: inline-block; margin-right:1px;" type="text" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="İsim / Name *" type="text" class="input-text" name="billing_first_name" id="billing_first_name" value="<?php if (!empty($_POST['billing_first_name'])) esc_attr_e($_POST['billing_first_name']); ?>" />
        </p>
        <p class="form-row form-row-last">
            <label style="display:none!important;" for="billing_last_name"><?php _e('Last name', 'woocommerce'); ?><span class="required">*</span></label>
            <input style="width: 130px; display: inline-block; margin-left:1px;" type="text" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="Soyisim / Surname *" type="text" class="input-text" name="billing_last_name" id="billing_last_name" value="<?php if (!empty($_POST['billing_last_name'])) esc_attr_e($_POST['billing_last_name']); ?>" />
        </p>
    </div>
    <p style="margin-bottom: 0px; margin-top: 10px;" class="form-row form-row-wide">
        <label style="display:none!important;" for="reg_billing_phone"><?php _e( 'Phone', 'woocommerce' ); ?></label>

        <!--  "You can’t have 2 times the value attribute and you can use "tel" type … (to be removed)" -->
        <input style="width:254px!important;" type="tel" class="woocommerce-Input woocommerce-Input--text input-text placeholder" placeholder="Cep Telefonu / Mobile *" name="billing_phone" id="reg_billing_phone" value="<?php esc_attr_e( $_POST['billing_phone'] ); ?>" /> *
    </p><br>
    <div class="clear"></div>
    <?php
}

// Checking & validation of custom fields in registration form.
add_action('woocommerce_register_post', 'text_domain_woo_validate_reg_form_fields', 10, 3);
function text_domain_woo_validate_reg_form_fields( $username, $email, $validation_errors ) {
    if (isset($_POST['billing_first_name']) && empty($_POST['billing_first_name'])) {
        $validation_errors->add('billing_first_name_error', __('İsim alanı zorunludur! / Name field is required!', 'woocommerce'));
    }
    if (isset($_POST['billing_last_name']) && empty($_POST['billing_last_name'])) {
        $validation_errors->add('billing_last_name_error', __('Soyisim alanı zorunludur! / Surname field is required!', 'woocommerce'));
    }
    if (isset($_POST['billing_phone']) && empty($_POST['billing_phone'])) {
        $validation_errors->add('billing_phone_error', __('Telefon alanı zorunludur! / Phone field is required!', 'woocommerce'));
    }

    // ==> CHECKING PHONE LENGTH (10 character minimal) <==
    if (isset($_POST['billing_phone']) && strlen($_POST['billing_phone']) < 10 ) {
        $validation_errors->add('billing_phone_error', __('Please type a correct phone number…', 'woocommerce'));
    }
    return $validation_errors;
}

// Add custom fields to registration form.
add_action( 'woocommerce_created_customer', 'custom_save_extra_register_fields' ); // <==== Missing
function custom_save_extra_register_fields($customer_id) {
    //First name field
    if (isset($_POST['billing_first_name'])) {
        update_user_meta($customer_id, 'first_name', sanitize_text_field($_POST['billing_first_name']));
        update_user_meta($customer_id, 'billing_first_name', sanitize_text_field($_POST['billing_first_name']));
    }
    //Last name field
    if (isset($_POST['billing_last_name'])) {
        update_user_meta($customer_id, 'last_name', sanitize_text_field($_POST['billing_last_name']));
        update_user_meta($customer_id, 'billing_last_name', sanitize_text_field($_POST['billing_last_name']));
    }
     //Phone field
    if (isset($_POST['billing_phone'])) {
        update_user_meta($customer_id, 'phone', sanitize_text_field($_POST['billing_phone']));
        update_user_meta($customer_id, 'billing_phone', sanitize_text_field($_POST['billing_phone']));
    }
}

代码会出现在您活动的子主题(或主题)的function.php文件中，也可能会出现在任何插件文件中.

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

经测试可正常工作

每次将检查电话号码的最小长度，并显示此警报(如果需要):

这篇关于在WooCommerce中添加自定义注册字段和电话字段验证问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！