You can achieve this with ajax request. First you can get the zones of the first country using the $countries[0]['country_id'] in your controller, so when the form is first opened, the zones of the first country will be displayed.

You need to add some jquery for an ajax call;

    $('select#country').change(function() {
        getAjax('url_of_the_ajax_controller', 'id='+$(this).val());
    });

function getAjax(url, varies)
{	
    request = $.ajax(
        {
            type: 'GET',
            url: url,
            dataType: "script",	
            data: varies		
        }
    );

    return request;
};

According to the above javascript code, the id of the country select list must be country. When you select a new country, the id of the selected country and your ajax url will be sent to the getAjax function. getAjax function will make a request to the url. So the controller of the target ajax url will get the zones of the requested country_id and will create a html select list and will change the current zones list. An example code is here:

$zones = DB::table('zones')->where('country_id', Input::get('id'))get();
        
        $html = '';
        foreach ($zones as $zone)
        {
            $html .= "<option value=\"" .  $zone['zone_id'] . "\">" .  e($zone['zone_name']) . "</option>";
        }


        return '$('#zones').html(\'' . $html. '\');';

i facing some problem about the same case. return '$('#zones').html('' . $html. '');'; is not working on my laravel controller.