Trying to add woo commerce shipping country and state drop down to custom account page

Question

I am quite new to working with PHP.

I am trying to add woo commerce country and state drop down to custom user account page.

• I need to get the users country and state from usermeta (checkout page shipping details)
• I need to display these on the account page, so user can edit them if they want - press update button to save the updated country and state to the same usermeta key.
• Also if the user changes the country in the drop down I need the state options to change corresponding to the country choosen.

Just wondering what code I would need for this?

I think I can get the country dropdown to appear by:

<?php
global $woocommerce;    
woocommerce_form_field( 'billing_country', array( 'type' => 'country' ) );
?>

But I am not sure how to get the existing usermeta data for billing country

Not sure how to get it to update

Not sure how to get state to appear and how to get the state dropdown options to change with what country is chosen.

Thanks in advance

---

Thanks JayDev - I reviewed the page link but that seems to be using hooks specific to the woo commerce account page. I am building a custom page.

From the link you sent and the custom page we already have I tried this but it did not seem to work. Any Ideas?

I tried the following but it did not seem to work .. any ideas?

in function.php

add_action( 'wp_ajax_account_details_information', 'account_details_information' );   
add_action( 'wp_ajax_nopriv_account_details_information', 'account_details_information' ); 

function account_details_information(){
    $user_id=$_POST['user_id'];
    $first_name=get_user_meta($user_id,'first_name',true);
    $last_name=get_user_meta($user_id,'last_name',true);
    $dob=get_user_meta($user_id,'birthday',true);
    $gender=get_user_meta($user_id,'gender',true);
    if($gender=="unknown"){
    $gender=    "Prefer not to say";
    }
    $phone=get_user_meta($user_id,'shipping_phone_number',true);
    $user_info = get_userdata($user_id);
    $email=$user_info->user_email;
    $address1=get_user_meta($user_id,'shipping_address_1',true);
    $address2=get_user_meta($user_id,'shipping_address_2',true);
    $country=get_user_meta($user_id,'shipping_country',true);
    $state=get_user_meta($user_id,'shipping_region',true);
    $city=get_user_meta($user_id,'shipping_city',true);
    $shipping_zip_code=get_user_meta($user_id,'shipping_zip_code',true);
    $add=$address1.' '.$address2.' '.$city.' '.$state.' '.$shipping_zip_code;
    $result=array('first_name'=>$first_name,'last_name'=>$last_name,'dob'=>$dob,'gender'=>$gender,
    'phone'=>$phone,'address'=>$add,'email'=>$email,'address_1'=>$address1,'address_2'=>$address2,
    'country'=>$country,'state'=>$state,'city'=>$city,'zipcode'=>$shipping_zip_code);
    echo json_encode($result);
    die();
    
}

add_action( 'wp_ajax_account_details_information_save', 'account_details_information_save' );   
add_action( 'wp_ajax_nopriv_account_details_information_save', 'account_details_information_save' ); 

function account_details_information_save(){
    $user_id=$_POST['user_id'];
        update_user_meta($user_id,'first_name',$_POST['first_name']);
        update_user_meta($user_id,'last_name',$_POST['last_name']);
        update_user_meta($user_id,'birthday',$_POST['dob']);
        update_user_meta($user_id,'gender',$_POST['gender']);
        
        update_user_meta($user_id,'shipping_address_1',$_POST['address_1']);
        update_user_meta($user_id,'shipping_address_2',$_POST['address_2']);
        update_user_meta($user_id,'shipping_country',$_POST['country']);
        update_user_meta($user_id,'shipping_region',$_POST['state']);
        update_user_meta($user_id,'shipping_city',$_POST['city']);
        update_user_meta($user_id,'shipping_zip_code',$_POST['zipcode']);
        update_user_meta($user_id,'shipping_phone_number',$_POST['phone']);
        $result=array('code'=>200);
        echo json_encode($result);
    die();
}

in custom page.php

<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}

global $woocommerce; 

?>


<div class="col-md-6">
<div class="form-group">
<label for="shipping_country">Country</label>

<label for="shipping_country"><?php  woocommerce_form_field( 'shipping_country', array( 'type' => 'country' ) ); ?></label>

</div>
</div>