如果用户没有从谷歌地图自动完成中选择城市，如何显示错误答案

【问题标题】：How to show an error if user has not opted city from google map auto complete如果用户没有从谷歌地图自动完成中选择城市，如何显示错误
【发布时间】：2018-03-01 21:46:54
【问题描述】：

如果用户没有从 Google 自动完成列表中选择城市，我正在寻找一种向用户显示错误的方法。有没有办法找到它？

目前我正在为autocomplete使用下面的代码

var txt_frm_addmarker_city  = document.getElementById('frm_addmarker_city');

var city_autocomplete_options = {
    language: 'it-IT',
    types: ['(cities)'],
    componentRestrictions: {country: "it"}
};

var autocomplete_txt_frm_addmarker_city = new google.maps.places.Autocomplete(txt_frm_addmarker_city, city_autocomplete_options);

// Add Marker form:: Get Position of Place (City)
google.maps.event.addListener(autocomplete_txt_frm_addmarker_city, 'place_changed', function() {
    var place = autocomplete_txt_frm_addmarker_city.getPlace();
    if ('undefined' != typeof place.geometry) {

        var lat = place.geometry.location.lat(),
            lng = place.geometry.location.lng();

        var randomGeoPoints = generateRandomPoints({'lat':lat, 'lng':lng}, 5000, 1);

        jQuery("input[name='latitude']").val(randomGeoPoints[0].lat);
        jQuery("input[name='longitude']").val(randomGeoPoints[0].lng);          
    }
    else {
        alertMagnificPopup("Error");
    }
});

所以基本上我希望用户仅从 Google 自动完成中选择城市。我不希望用户只在城市字段中输入 XYZ。那么有什么方法可以向用户显示错误并且不允许继续进行？

【问题讨论】：

在 else 部分你有 alertMagnificPopup("Error");执行一些清除文本框的功能。

标签： javascript google-maps-api-3 autocomplete

【解决方案1】：

您可以在此处使用标志变量来验证：

var isOptionSelected = false;

google.maps.event.addListener(autocomplete_txt_frm_addmarker_city, 'place_changed', function() {
    isOptionSelected = true;
    // your map option select logic here
});

// On submit button click you can verify that
document.getElementById("submitForm").addEventListener("click", function(){
    if (!isOptionSelected){
        alert('Please select an option from autocomplete');
        return;  // skip an further form processing logic
    }

    // Reset the flag state here
    isOptionSelected = false;

    // Now, continue with your logic
});

【讨论】：