Dynamically Filled Select Not Saving

Hello
I have 2 select_advanced fields, one for country and the other for city.
I use Ajax to dynamically select the city based on the country selected - this is working, i.e. if I select Belgium, I get a list of 5 Belgian cities to select from. If I select Austria, I get 5 Austrian cities. Good so far.
However, when I save (using the WP admin area or mb_user_profile_info) it saves only the country, not the city.
Please can you help?
Many thanks

Where the form appears:

$outputstring .= do_shortcode( sprintf( '[mb_user_profile_info id="obr_default_user_info" user_id="%1$d" label_submit="Save Changes" confirmation="The updated user information has been successfully saved. Thank you."]', $user_id ) );

Country and City fields initialised:

            $meta_boxes[] = [
                'title'         => __( 'User Information', 'awaw' ),
                'id'            => 'obr_default_user_info',
                'type'          => 'user',
                'fields'        => [
                    [
                        'type'          => 'heading',
                        'name'          => __( 'Current Location', 'awaw' ),
                        'desc'          => __( 'Where are you living?', 'awaw' ),
                    ],
                    [
                        'type'          => 'select_advanced',
                        'name'          => __( 'Current Country', 'awaw' ),
                        'id'            => 'obr_user_country',  // not a standard WP User field
                        'placeholder'   => __( 'Country', 'awaw' ),
                        'required'      => true,
                        'options'       => $this->countries,
                        'js_options'    => [
                                                'tags'  => false, // false disables free text input, true enables it
                                            ],
                    ],
                    [
                        'type'          => 'select_advanced',
                        'name'          => __( 'Current City', 'awaw' ),
                        'id'            => 'obr_user_city',  // not a standard WP User field
                        'placeholder'   => __( 'City', 'awaw' ),
                        'multiple'      => false,
                        'required'      => true,
                        'options'       => $this->cities,
                        'js_options'    => [
                                                'tags'  => false, // false disables free text input, true enables it
                                            ],
                    ],
                ],
            ];

Ajax to change obr_user_city. This works...

    $( '#obr_user_country' ).change( function( e ) {
        var country = $( '#obr_user_country' ).val();

    var formData = {
        nonce: obr_awaw_js_ajax_object.obr_awaw_nonce,
        action: 'obr_location_ajax',
        country: country,
    };
    $.ajax({
        method: "POST",
        url: obr_awaw_js_ajax_object.ajax_url,
        data: formData,
        success: function ( response ) {
            var responsedata = $.parseJSON( response );
            if ( 'success' == responsedata.status ) {
                //console.log( responsedata );
                $( '#obr_user_city' ).empty();
                $.each( responsedata.cities, function( i, val ) {
                    $( '#obr_user_city' ).append( '<option value="' + val + '">' + val + '</option>' );
                });
                $( '#obr_user_city' ).trigger( 'change' );
            } else {
                console.log("FAILURE");
            }
        },
        error: function( error ) {
            console.log( error );
        },
    });
});