Using the WooCommerce API to get the country/state lists Using the WooCommerce API to get the country/state lists wordpress wordpress

Using the WooCommerce API to get the country/state lists


Try this , You still need to go for some javascript to make it work.I do not know if there is any way by default to make state drop-down list work as according to country drop-down list.I think it is helpful, give a try and let me know, if it worked.

global $woocommerce;$countries_obj   = new WC_Countries();$countries   = $countries_obj->__get('countries');$default_country = $countries_obj->get_base_country();$default_county_states = $countries_obj->get_states( $default_country );

so this makes your countries dropdown

global $woocommerce;$countries_obj   = new WC_Countries();$countries   = $countries_obj->__get('countries');echo '<div id="my_custom_countries_field"><h2>' . __('Countries') . '</h2>';woocommerce_form_field('my_country_field', array('type'       => 'select','class'      => array( 'chzn-drop' ),'label'      => __('Select a country'),'placeholder'    => __('Enter something'),'options'    => $countries));echo '</div>';

and State dropdown

    global $woocommerce;    $countries_obj   = new WC_Countries();    $countries   = $countries_obj->__get('countries');    $default_country = $countries_obj->get_base_country();    $default_county_states = $countries_obj->get_states( $default_country );    echo '<div id="my_custom_state_field"><h2>' . __('States') . '</h2>';    woocommerce_form_field('my_state_field', array(    'type'       => 'select',    'class'      => array( 'chzn-drop' ),    'label'      => __('Select a state'),    'placeholder'    => __('Enter something'),    'options'    => $default_county_states    )    );    echo '</div>';

You need some javascript to make it work as you want. You may consider going through woocommerce_form_field .

I have added the below code on my functions.php and the screenshot shows what I am getting .Need to know about your checkout page to make it better.

"I believe it is all about creating the same HTML elements as in default checkout page."

//Reordering woocommerce billing form on checkout pageadd_filter( 'woocommerce_checkout_fields','reorder_woo_billing_fields' );function reorder_woo_billing_fields( $fields ) {    //$fields2['billing']['billing_email'] = $fields['billing']['billing_email'];    $fields2['billing']['billing_first_name'] = $fields['billing']['billing_first_name'];    $fields2['billing']['billing_last_name'] = $fields['billing']['billing_last_name'];    $fields2['billing']['billing_company'] = $fields['billing']['billing_company'];    $fields2['billing']['billing_address_1'] = $fields['billing']['billing_address_1'];    $fields2['billing']['billing_address_2'] = $fields['billing']['billing_address_2'];    $fields2['billing']['billing_city'] = $fields['billing']['billing_city'];    $fields2['billing']['billing_country'] = $fields['billing']['billing_country'];    $fields2['billing']['billing_state'] = $fields['billing']['billing_state'];    $fields2['billing']['billing_postcode'] = $fields['billing']['billing_postcode'];    $fields2['billing']['billing_phone'] = $fields['billing']['billing_phone'];    $fields2['billing']['billing_country']['class'] = array('box', 'form-row form-row-first address-field update_totals_on_change validate-required woocommerce-validated');    $fields2['billing']['billing_state']['class'] = array('box', 'form-row form-row-last address-field validate-required validate-state woocommerce-invalid woocommerce-invalid-required-field');    $fields2['billing']['billing_postcode']['class'] = array('box', 'form-row form-row-first address-field validate-required validate-postcode');    $fields2['billing']['billing_phone']['class'] = array('box', 'form-row form-row-last validate-required validate-phone');    //$fields2['billing']['billing_email']['class'] = array('box', 'form-row form-row-wide validate-required validate-email');    $fields2['billing']['billing_postcode']['clear'] = '';    $fields2['shipping'] = $fields['shipping'];    $fields2['account'] = $fields['account'];    $fields2['order'] = $fields['order'];     return $fields2;}add_action( 'woocommerce_checkout_init', 'woocommerce_countries_states', 10, 1 );function woocommerce_countries_states( $checkout ) {    global $woocommerce;    $countries_obj   = new WC_Countries();    $countries   = $countries_obj->__get('countries');    $default_country = $countries_obj->get_base_country();    $default_county_states = $countries_obj->get_states( $default_country );    $checkout->checkout_fields['account']['billing_country'] = array(        'type'              => 'select',        'label'             => __( 'Default Contries', 'woocommerce' ),        'required'          => true,        'options'    => $countries    );    $checkout->checkout_fields['account']['billing_country'] = array(        'type'              => 'select',        'label'             => __( 'Default Contries', 'woocommerce' ),        'required'          => true,         'options'    => $default_county_states    );}

HTML I am getting is somehow like( For country chosen United States(US) ):-

<p class="form-row form-row box form-row form-row-first address-field update_totals_on_change validate-required woocommerce-validated validate-required" id="billing_country_field"><label for="billing_country" class="">Country <abbr class="required" title="required">*</abbr></label><div class="select2-container country_to_state country_select" id="s2id_billing_country" style="width: 100%;"><a href="javascript:void(0)" class="select2-choice" tabindex="-1">   <span class="select2-chosen" id="select2-chosen-1">United States (US)</span><abbr class="select2-search-choice-close"></abbr>   <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen1" class="select2-offscreen">Country *</label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-1" id="s2id_autogen1"></div><select name="billing_country" id="billing_country" class="country_to_state country_select " tabindex="-1" title="Country *" style="display: none;"><option value="">Select a country…</option><option value="AX">Åland Islands</option><option value="AF">Afghanistan</option><option value="AL">Albania</option><option value="DZ">Algeria</option><option value="AD">Andorra</option><option value="AO">Angola</option><option value="AI">Anguilla</option><option value="AQ">Antarctica</option><option value="AG">Antigua and Barbuda</option><option value="AR">Argentina</option><option value="AM">Armenia</option><option value="AW">Aruba</option><option value="AU">Australia</option><option value="AT">Austria</option><option value="AZ">Azerbaijan</option><option value="BS">Bahamas</option><option value="BH">Bahrain</option><option value="BD">Bangladesh</option><option value="BB">Barbados</option><option value="BY">Belarus</option><option value="PW">Belau</option><option value="BE">Belgium</option><option value="BZ">Belize</option><option value="BJ">Benin</option><option value="BM">Bermuda</option><option value="BT">Bhutan</option><option value="BO">Bolivia</option><option value="BQ">Bonaire, Saint Eustatius and Saba</option><option value="BA">Bosnia and Herzegovina</option><option value="BW">Botswana</option><option value="BV">Bouvet Island</option><option value="BR">Brazil</option><option value="IO">British Indian Ocean Territory</option><option value="VG">British Virgin Islands</option><option value="BN">Brunei</option><option value="BG">Bulgaria</option><option value="BF">Burkina Faso</option><option value="BI">Burundi</option><option value="KH">Cambodia</option><option value="CM">Cameroon</option><option value="CA">Canada</option><option value="CV">Cape Verde</option><option value="KY">Cayman Islands</option><option value="CF">Central African Republic</option><option value="TD">Chad</option><option value="CL">Chile</option><option value="CN">China</option><option value="CX">Christmas Island</option><option value="CC">Cocos (Keeling) Islands</option><option value="CO">Colombia</option><option value="KM">Comoros</option><option value="CG">Congo (Brazzaville)</option><option value="CD">Congo (Kinshasa)</option><option value="CK">Cook Islands</option><option value="CR">Costa Rica</option><option value="HR">Croatia</option><option value="CU">Cuba</option><option value="CW">CuraÇao</option><option value="CY">Cyprus</option><option value="CZ">Czech Republic</option><option value="DK">Denmark</option><option value="DJ">Djibouti</option><option value="DM">Dominica</option><option value="DO">Dominican Republic</option><option value="EC">Ecuador</option><option value="EG">Egypt</option><option value="SV">El Salvador</option><option value="GQ">Equatorial Guinea</option><option value="ER">Eritrea</option><option value="EE">Estonia</option><option value="ET">Ethiopia</option><option value="FK">Falkland Islands</option><option value="FO">Faroe Islands</option><option value="FJ">Fiji</option><option value="FI">Finland</option><option value="FR">France</option><option value="GF">French Guiana</option><option value="PF">French Polynesia</option><option value="TF">French Southern Territories</option><option value="GA">Gabon</option><option value="GM">Gambia</option><option value="GE">Georgia</option><option value="DE">Germany</option><option value="GH">Ghana</option><option value="GI">Gibraltar</option><option value="GR">Greece</option><option value="GL">Greenland</option><option value="GD">Grenada</option><option value="GP">Guadeloupe</option><option value="GT">Guatemala</option><option value="GG">Guernsey</option><option value="GN">Guinea</option><option value="GW">Guinea-Bissau</option><option value="GY">Guyana</option><option value="HT">Haiti</option><option value="HM">Heard Island and McDonald Islands</option><option value="HN">Honduras</option><option value="HK">Hong Kong</option><option value="HU">Hungary</option><option value="IS">Iceland</option><option value="IN">India</option><option value="ID">Indonesia</option><option value="IR">Iran</option><option value="IQ">Iraq</option><option value="IM">Isle of Man</option><option value="IL">Israel</option><option value="IT">Italy</option><option value="CI">Ivory Coast</option><option value="JM">Jamaica</option><option value="JP">Japan</option><option value="JE">Jersey</option><option value="JO">Jordan</option><option value="KZ">Kazakhstan</option><option value="KE">Kenya</option><option value="KI">Kiribati</option><option value="KW">Kuwait</option><option value="KG">Kyrgyzstan</option><option value="LA">Laos</option><option value="LV">Latvia</option><option value="LB">Lebanon</option><option value="LS">Lesotho</option><option value="LR">Liberia</option><option value="LY">Libya</option><option value="LI">Liechtenstein</option><option value="LT">Lithuania</option><option value="LU">Luxembourg</option><option value="MO">Macao S.A.R., China</option><option value="MK">Macedonia</option><option value="MG">Madagascar</option><option value="MW">Malawi</option><option value="MY">Malaysia</option><option value="MV">Maldives</option><option value="ML">Mali</option><option value="MT">Malta</option><option value="MH">Marshall Islands</option><option value="MQ">Martinique</option><option value="MR">Mauritania</option><option value="MU">Mauritius</option><option value="YT">Mayotte</option><option value="MX">Mexico</option><option value="FM">Micronesia</option><option value="MD">Moldova</option><option value="MC">Monaco</option><option value="MN">Mongolia</option><option value="ME">Montenegro</option><option value="MS">Montserrat</option><option value="MA">Morocco</option><option value="MZ">Mozambique</option><option value="MM">Myanmar</option><option value="NA">Namibia</option><option value="NR">Nauru</option><option value="NP">Nepal</option><option value="NL">Netherlands</option><option value="AN">Netherlands Antilles</option><option value="NC">New Caledonia</option><option value="NZ">New Zealand</option><option value="NI">Nicaragua</option><option value="NE">Niger</option><option value="NG">Nigeria</option><option value="NU">Niue</option><option value="NF">Norfolk Island</option><option value="KP">North Korea</option><option value="NO">Norway</option><option value="OM">Oman</option><option value="PK">Pakistan</option><option value="PS">Palestinian Territory</option><option value="PA">Panama</option><option value="PG">Papua New Guinea</option><option value="PY">Paraguay</option><option value="PE">Peru</option><option value="PH">Philippines</option><option value="PN">Pitcairn</option><option value="PL">Poland</option><option value="PT">Portugal</option><option value="QA">Qatar</option><option value="IE">Republic of Ireland</option><option value="RE">Reunion</option><option value="RO">Romania</option><option value="RU">Russia</option><option value="RW">Rwanda</option><option value="ST">São Tomé and Príncipe</option><option value="BL">Saint Barthélemy</option><option value="SH">Saint Helena</option><option value="KN">Saint Kitts and Nevis</option><option value="LC">Saint Lucia</option><option value="SX">Saint Martin (Dutch part)</option><option value="MF">Saint Martin (French part)</option><option value="PM">Saint Pierre and Miquelon</option><option value="VC">Saint Vincent and the Grenadines</option><option value="SM">San Marino</option><option value="SA">Saudi Arabia</option><option value="SN">Senegal</option><option value="RS">Serbia</option><option value="SC">Seychelles</option><option value="SL">Sierra Leone</option><option value="SG">Singapore</option><option value="SK">Slovakia</option><option value="SI">Slovenia</option><option value="SB">Solomon Islands</option><option value="SO">Somalia</option><option value="ZA" selected="selected">South Africa</option><option value="GS">South Georgia/Sandwich Islands</option><option value="KR">South Korea</option><option value="SS">South Sudan</option><option value="ES">Spain</option><option value="LK">Sri Lanka</option><option value="SD">Sudan</option><option value="SR">Suriname</option><option value="SJ">Svalbard and Jan Mayen</option><option value="SZ">Swaziland</option><option value="SE">Sweden</option><option value="CH">Switzerland</option><option value="SY">Syria</option><option value="TW">Taiwan</option><option value="TJ">Tajikistan</option><option value="TZ">Tanzania</option><option value="TH">Thailand</option><option value="TL">Timor-Leste</option><option value="TG">Togo</option><option value="TK">Tokelau</option><option value="TO">Tonga</option><option value="TT">Trinidad and Tobago</option><option value="TN">Tunisia</option><option value="TR">Turkey</option><option value="TM">Turkmenistan</option><option value="TC">Turks and Caicos Islands</option><option value="TV">Tuvalu</option><option value="UG">Uganda</option><option value="UA">Ukraine</option><option value="AE">United Arab Emirates</option><option value="GB">United Kingdom (UK)</option><option value="US">United States (US)</option><option value="UY">Uruguay</option><option value="UZ">Uzbekistan</option><option value="VU">Vanuatu</option><option value="VA">Vatican</option><option value="VE">Venezuela</option><option value="VN">Vietnam</option><option value="WF">Wallis and Futuna</option><option value="EH">Western Sahara</option><option value="WS">Western Samoa</option><option value="YE">Yemen</option><option value="ZM">Zambia</option><option value="ZW">Zimbabwe</option></select><noscript>&lt;input type="submit" name="woocommerce_checkout_update_totals" value="Update country" /&gt;</noscript></p><p class="form-row form-row box form-row form-row-last address-field validate-state woocommerce-invalid woocommerce-invalid-required-field validate-state validate-required" id="billing_state_field" data-o_class="form-row form-row box form-row form-row-last address-field validate-required validate-state woocommerce-invalid woocommerce-invalid-required-field validate-required validate-state" style="display: block;"><label for="billing_state" class="">State <abbr class="required" title="required">*</abbr></label><div class="select2-container state_select" id="s2id_billing_state" style="width: 100%;"><a href="javascript:void(0)" class="select2-choice select2-default" tabindex="-1">   <span class="select2-chosen" id="select2-chosen-491">Select an option…</span><abbr class="select2-search-choice-close"></abbr>   <span class="select2-arrow" role="presentation"><b role="presentation"></b></span></a><label for="s2id_autogen491" class="select2-offscreen">State <abbr class="required" title="required">*</abbr></label><input class="select2-focusser select2-offscreen" type="text" aria-haspopup="true" role="button" aria-labelledby="select2-chosen-491" id="s2id_autogen491"></div><select name="billing_state" id="billing_state" class="state_select" placeholder="" tabindex="-1" title="Province " style="display: none;"><option value="">Select an option…</option><option value="AL">Alabama</option><option value="AK">Alaska</option><option value="AZ">Arizona</option><option value="AR">Arkansas</option><option value="CA">California</option><option value="CO">Colorado</option><option value="CT">Connecticut</option><option value="DE">Delaware</option><option value="DC">District Of Columbia</option><option value="FL">Florida</option><option value="GA">Georgia</option><option value="HI">Hawaii</option><option value="ID">Idaho</option><option value="IL">Illinois</option><option value="IN">Indiana</option><option value="IA">Iowa</option><option value="KS">Kansas</option><option value="KY">Kentucky</option><option value="LA">Louisiana</option><option value="ME">Maine</option><option value="MD">Maryland</option><option value="MA">Massachusetts</option><option value="MI">Michigan</option><option value="MN">Minnesota</option><option value="MS">Mississippi</option><option value="MO">Missouri</option><option value="MT">Montana</option><option value="NE">Nebraska</option><option value="NV">Nevada</option><option value="NH">New Hampshire</option><option value="NJ">New Jersey</option><option value="NM">New Mexico</option><option value="NY">New York</option><option value="NC">North Carolina</option><option value="ND">North Dakota</option><option value="OH">Ohio</option><option value="OK">Oklahoma</option><option value="OR">Oregon</option><option value="PA">Pennsylvania</option><option value="RI">Rhode Island</option><option value="SC">South Carolina</option><option value="SD">South Dakota</option><option value="TN">Tennessee</option><option value="TX">Texas</option><option value="UT">Utah</option><option value="VT">Vermont</option><option value="VA">Virginia</option><option value="WA">Washington</option><option value="WV">West Virginia</option><option value="WI">Wisconsin</option><option value="WY">Wyoming</option><option value="AA">Armed Forces (AA)</option><option value="AE">Armed Forces (AE)</option><option value="AP">Armed Forces (AP)</option><option value="AS">American Samoa</option><option value="GU">Guam</option><option value="MP">Northern Mariana Islands</option><option value="PR">Puerto Rico</option><option value="UM">US Minor Outlying Islands</option><option value="VI">US Virgin Islands</option></select></p>

enter image description here enter image description here

*New visitors Please consider going through edits,to know how this answer has been changed .


This is referred to as the "base country" by WooCommerce:

$woo_countries = new WC_Countries();// Get default country$default_country = $woo_countries->get_base_country();// Get states in default country$states = $woo_countries->get_states( $default_country );

Read more in the API docs.

It should be noted that the default WooCommerce billing form template logic ensures that the default country and state are pre-selected. Here's what it looks like:

<?php foreach ( $checkout->checkout_fields['billing'] as $key => $field ) : ?>    <?php woocommerce_form_field( $key, $field, $checkout->get_value( $key ) ); ?><?php endforeach; ?>

The third argument passed to woocommerce_form_field() ensures that the default country and state are pre-populated.