Interaction of two "select" type custom fields in checkout form (Woocommerce) [closed]

Question

Need to create an interaction between two select type custom fields in the checkout form.

The options values for both are in a database table.

The first select includes the cities and the other one the locations of the whole country of a local courier service firm (Akis). When the city is selected on the first select field ("akiscity_woocommerce") the other one ("akisloc_woocommerce") should only include the corresponded locations in the city.

On page load this works for the first available city (as is it shown below), but obviously this should also work for any subsequent city selections. I would very much appreciate any help to setup this.

add_action( 'woocommerce_after_order_notes', 'akis_express' );
function akis_express($checkout) {

    global $wpdb;

    $resultscity = $wpdb->get_results( "SELECT akisid, akiscity FROM wp_akislocations GROUP BY akiscity" );
//    $otionscity  = array( '' => __('Selection of Akis City') );

    // Loop through the data query results
    $city='';
    foreach($resultscity as $result) {
        if($city=='') $city = $result->akiscity;
        $optionscity[$result->akisid] = $result->akiscity;
    }

    $resultsloc = $wpdb->get_results( "SELECT akisid, akisloc FROM wp_akislocations WHERE akiscity = '".$city."'" );
//    $otionsloc  = array( '' => __('Selection of Akis Location') );

    // Loop through the data query results
    foreach($resultsloc as $result) {
        $optionsloc[$result->akisid] = $result->akisloc;
    }

    echo '<div id="akiscity_woocommerce"><h4>' . __('Select Akis Express City') . '</h4>';
    woocommerce_form_field('akiscity', array(
        'type' => 'select',
        'class'=> array('akiscity form-row-first'),
//        'label' => __('Select Akis Express City'),
        'required' => true,
        'options'   =>  $optionscity, 
        'placeholder' => __('Pick City/Area')
    ), $checkout->get_value('akiscity') );
    echo '</div>';


    echo '<div id="akisloc_woocommerce"><h4>' . __('Select Akis Express Location') . '</h4>';
    woocommerce_form_field( 'akisloc', array(
        'type'          => 'select',
        'class'         => array('akisloc form-row-first'),
//        'label'         => __('Select Akis Express Location'),
        'required'      => true,
        'options'       => $optionsloc,
        'placeholder' => __('Pick Location')
    ),  $checkout->get_value( 'akisloc' ) );
    echo '</div>';
}