Cannot access variable inside select2 AJAX URL

Question

I have country and city select boxes. Content is loading to city box based on the country id. The problem is that AJAX URL always sees only the initial value of countryId, although I can access right value from other functions.

$(document).ready(function() {
    var countryId = 1;

    $(".country-select").select2({
        placeholder: "Select a country",
        data: countries
    });

    $(".country-select").on("select2:select", function(e) {
        countryId = e.params.data["id"];
    });

    $(".city-select").select2({
        placeholder: "Select a city",
        ajax: {
            //countryId always equals 1
            url: "https://api.vk.com/method/database.getCities?country_id=" + countryId,
            //other options
        }
    });

    $(".somediv").click(function() {
        alert(countryId); //alerts right value
    });
});