JSFiddle - React, Tailwind, and code Playground
HTML
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
<form id="loc_search" action="...">
<input type="text" id="location" name="location">
<button type="submit" id="submit_search">Search</button>
</form>
JavaScript
var locMatch = false;
$(function () {
var mpA = new google.maps.places.Autocomplete(document.getElementById('location'));
google.maps.event.addListener(mpA, 'place_changed', function () {
console.log('place_changed fired');
var place = mpA.getPlace();
locMatch = false;
if (place && place.geometry) {
locMatch = true;
}
});
$('#loc_search').submit(function (e) {
console.log('onSubmit fired. locMatch:', locMatch);
e.preventDefault();
});
});