Adding extra fields to the woocommerce form in wordpress

Question

I have managed to add several extra fields to the woocommerce registration form. But in the chechout form, all the fields that I have added do not appear auto-filled. The fields that do not appear in the checkout are: "Country" and "State". As you can see in this image (https://postimg.cc/vc57qkkF) for the country and state fields a select appears. but I need to show the country and state that I entered when I registered. This is the code that I have added to functions.php:

/**
 * Add new register fields for WooCommerce registration
 * To add WooCommerce registration form custom fields.
 */
add_action( 'woocommerce_register_form', 'misha_add_register_form_field' );
 
function misha_add_register_form_field(){
 
    woocommerce_form_field(
        'billing_first_name',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'First name'
        ),
        ( isset($_POST['billing_first_name']) ? $_POST['billing_first_name'] : '' )
    );
    woocommerce_form_field(
        'billing_last_name',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'Last name'
        ),
        ( isset($_POST['billing_last_name']) ? $_POST['billing_last_name'] : '' )
    );
    woocommerce_form_field(
        'billing_phone',
        array(
            'type'        => 'tel',
            'required'    => true, // just adds an "*"
            'label'       => 'Phone'
        ),
        ( isset($_POST['billing_phone']) ? $_POST['billing_phone'] : '' )
    );
    woocommerce_form_field(
        'billing_address_1',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'Address'
        ),
        ( isset($_POST['billing_address_1']) ? $_POST['billing_address_1'] : '' )
    );
    woocommerce_form_field(
        'billing_city',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'City'
        ),
        ( isset($_POST['billing_city']) ? $_POST['billing_city'] : '' )
    );
    woocommerce_form_field(
        'billing_postcode',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'Post Code'
        ),
        ( isset($_POST['billing_postcode']) ? $_POST['billing_postcode'] : '' )
    );
    woocommerce_form_field(
        'billing_country',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'Country'
        ),
        ( isset($_POST['billing_country']) ? $_POST['billing_country'] : '' )
    );
    woocommerce_form_field(
        'billing_state',
        array(
            'type'        => 'text',
            'required'    => true, // just adds an "*"
            'label'       => 'State'
        ),
        ( isset($_POST['billing_state']) ? $_POST['billing_state'] : '' )
    );
 
}
/**
 * To validate WooCommerce registration form custom fields.
 */
add_action( 'woocommerce_register_post', 'misha_validate_fields', 10, 3 );
 
function misha_validate_fields( $username, $email, $errors ) {
 
    if ( empty( $_POST['billing_first_name'] ) ) {
        $errors->add( 'billing_first_name_error', 'First name is required!' );
    }
    if ( empty( $_POST['billing_last_name'] ) ) {
        $errors->add( 'billing_last_name_error', 'Last name is required!' );
    }
    if ( empty( $_POST['billing_phone'] ) ) {
        $errors->add( 'billing_phone_error', 'Phone is required!' );
    }
    if ( empty( $_POST['billing_address_1'] ) ) {
        $errors->add( 'billing_address_1_error', 'Address is required!' );
    }
    if ( empty( $_POST['billing_city'] ) ) {
        $errors->add( 'billing_city_error', 'City is required!' );
    }
    if ( empty( $_POST['billing_postcode'] ) ) {
        $errors->add( 'billing_postcode_error', 'Post code is required!' );
    }
    if ( empty( $_POST['billing_country'] ) ) {
        $errors->add( 'billing_country_error', 'Country is required!' );
    }
    if ( empty( $_POST['billing_state'] ) ) {
        $errors->add( 'billing_state_error', 'State is required!' );
    }   
}
/**
 * To save WooCommerce registration form custom fields.
 */
add_action( 'woocommerce_created_customer', 'misha_save_register_fields' );
 
function misha_save_register_fields( $customer_id ){
   //First name field
    if ( isset( $_POST['billing_first_name'] ) ) {
        //update_user_meta( $customer_id, 'country_to_visit', wc_clean( $_POST['country_to_visit'] ) );
        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']));
    }
    // WooCommerce billing phone
    if ( isset( $_POST['billing_phone'] ) ) {
        update_user_meta( $customer_id, 'billing_phone', sanitize_text_field( $_POST['billing_phone'] ) );
    }
    // WooCommerce billing address
    if ( isset( $_POST['billing_address_1'] ) ) {
        update_user_meta( $customer_id, 'billing_address_1', sanitize_text_field( $_POST['billing_address_1'] ) );
    }
        // WooCommerce billing city
    if ( isset( $_POST['billing_city'] ) ) {
        update_user_meta( $customer_id, 'billing_city', sanitize_text_field( $_POST['billing_city'] ) );
    }
    if ( isset( $_POST['billing_postcode'] ) ) {
        update_user_meta( $customer_id, 'billing_postcode', sanitize_text_field( $_POST['billing_postcode'] ) );
    }
    if ( isset( $_POST['billing_country'] ) ) {
        update_user_meta( $customer_id, 'billing_country', sanitize_text_field( $_POST['billing_country'] ) );
    }
    if ( isset( $_POST['billing_state'] ) ) {
        update_user_meta( $customer_id, 'billing_state', sanitize_text_field( $_POST['billing_state'] ) );
    }
}
add_action( 'woocommerce_created_customer', 'wooc_save_extra_register_fields' );

Cato · Accepted Answer

I cannot add comments yet so I'm adding a question here and making my best shot at answering at the same time.. Will edit if needed.

1st of all, Just for debugging purposes to make sure I'm on the right track, I'm guessing these fields also do not auto populate on the My Account page either, right?

I see you're doing a text field for the country and state. You need the use the built in WooCommerce's Country and State field types so the values stored can be mapped to the selects options and thus auto select the proper option.

Try this:

Add this at the top of your misha_add_register_form_field function, to get the countries list from WC.

$countries_obj = new WC_Countries();
$countries = $countries_obj->__get('countries');

Then, to show these fields in the form replace the country and state fields in your misha_add_register_form_field() function with these:

woocommerce_form_field(
    'billing_country',
    array(
      'type' => 'country',
      'label' => 'Country',
      'required' => 1,
      'class' => ['address-field']
    ),
    ''
  );

  woocommerce_form_field(
    'billing_state',
    array(
      'type' => 'state',
      'label' => 'State',
      'required' => 1,
      'class' => ['address-field'],
      'validate' => ['state']
    ),
    ''
  );

You'll need to update the validations and sanitizers for those 2 fields, and maybe do a some extra work to make sure it's updated properly. You can reference Using the WooCommerce API to get the country/state lists and Add Billing Address to Woocommerce Registration Page as they seem to address the same challenge.

Adding extra fields to the woocommerce form in wordpress

Answers (1)

Related Questions