我们能否在componentRestrictions模块中动态传递国家/地区代码

Question

我有一个国家/地区列表的选择选项，用户可以从中选择国家/地区，选择国家/地区后，“ google autocomplete”搜索选项应只显示选定国家/地区的城市。

如您所见，我在选择下拉列表中有县列表，并且当用户选择隐藏的国家/地区时，使用所选择的代码更新时，有一个隐藏的文件存储国家代码，例如（美国，英国等）。从下拉菜单中），然后当用户键入文本字段中的位置以进行搜索时，则应该仅显示该国家/地区内的城市详细信息。

带有html代码的PHP代码

<select name="country" class="form-control" data-validation="required"> 
    <option value="">Country...</option>
    <?php 
       $countrylist= $db_help->listAll($cn,"country");
       if($countrylist!=='fail')
       {
            foreach($countrylist as $country)
            {
                echo ' <option value="'.$country['country_name'].'" data-country_code="'.$country['code'].'">'.$country['country_name'].'</option>';
            }
       }
    ?>
</select>
<input type="hidden" id="country_code" value="IN"/>

我的javascript代码是：-

<script>
    $(document).ready(function(){

        $("select[name='country']").on('change',function(){
            var code=$(this).find(':selected').attr('data-country_code')
            $("#country_code").val(code);
        })
    })

</script>
<script>
    var placeSearch, autocomplete;
    var code=document.getElementById('country_code').value;
    var countrycode=code.toLowerCase();
    function initAutocomplete() {
        /*var options = {
            types: ['geocode'],
            componentRestrictions: {
                country: 'in'
            }

        };*/

        var options = {
        types: ['(cities)'],
            componentRestrictions: {country: '+country_code+'} //in (India)
        };

        var input = document.getElementById('list_local');
        var autocomplete = new google.maps.places.Autocomplete(input, options);

    }

    function geolocate() {
        if (navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function (position) {
                var geolocation = {
                    lat: position.coords.latitude,
                    lng: position.coords.longitude
                };
                var circle = new google.maps.Circle({
                    center: geolocation,
                    radius: position.coords.accuracy
                });
                autocomplete.setBounds(circle.getBounds());
            });
        }
    }
</script>