Now not even creating autocomplete widget when the full address is prepopulated, as it is when coming back to the page
This commit is contained in:
parent
f0858b289c
commit
e71f7109dd
1 changed files with 36 additions and 36 deletions
|
|
@ -192,6 +192,7 @@ export default ({
|
||||||
this.addressModel.zipCode !== null) {
|
this.addressModel.zipCode !== null) {
|
||||||
|
|
||||||
this.showAddressFields = true;
|
this.showAddressFields = true;
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const addressField1 = document.getElementById("autocomplete");
|
const addressField1 = document.getElementById("autocomplete");
|
||||||
|
|
@ -230,34 +231,34 @@ export default ({
|
||||||
|
|
||||||
})
|
})
|
||||||
|
|
||||||
addressField1.onchange = function() {
|
addressField1.onchange = function() {
|
||||||
const hover = document.querySelector(".pac-container .pac-item:hover");
|
const hover = document.querySelector(".pac-container .pac-item:hover");
|
||||||
// if an item has been clicked, do nothing, otherwise get first solution and use Geocoder to get the place
|
// if an item has been clicked, do nothing, otherwise get first solution and use Geocoder to get the place
|
||||||
if (hover === null) {
|
if (hover === null) {
|
||||||
const item = document.querySelector(".pac-container .pac-item");
|
const item = document.querySelector(".pac-container .pac-item");
|
||||||
if (item != null) {
|
if (item != null) {
|
||||||
const firstResult = item.textContent;
|
const firstResult = item.textContent;
|
||||||
const geocoder = new window.google.maps.Geocoder();
|
const geocoder = new window.google.maps.Geocoder();
|
||||||
geocoder.geocode({
|
geocoder.geocode({
|
||||||
address: firstResult
|
address: firstResult
|
||||||
}, function (results, status) {
|
}, function (results, status) {
|
||||||
if (status === window.google.maps.GeocoderStatus.OK) {
|
if (status === window.google.maps.GeocoderStatus.OK) {
|
||||||
fillInAddress(results[0]);
|
fillInAddress(results[0]);
|
||||||
self.displayVerificationWarning = true;
|
self.displayVerificationWarning = true;
|
||||||
self.displayNoMatchWarning = false;
|
self.displayNoMatchWarning = false;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
|
||||||
else {
|
|
||||||
self.addressModel.city = "";
|
|
||||||
self.addressModel.state = "";
|
|
||||||
self.addressModel.zipCode = "";
|
|
||||||
self.showAddressFields = true;
|
|
||||||
self.displayVerificationWarning = false;
|
|
||||||
self.displayNoMatchWarning = true;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
else {
|
||||||
|
self.addressModel.city = "";
|
||||||
|
self.addressModel.state = "";
|
||||||
|
self.addressModel.zipCode = "";
|
||||||
|
self.showAddressFields = true;
|
||||||
|
self.displayVerificationWarning = false;
|
||||||
|
self.displayNoMatchWarning = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
function fillInAddress(place) {
|
function fillInAddress(place) {
|
||||||
if (!place) {
|
if (!place) {
|
||||||
|
|
@ -265,6 +266,7 @@ export default ({
|
||||||
}
|
}
|
||||||
|
|
||||||
if (place && place.address_components) {
|
if (place && place.address_components) {
|
||||||
|
self.addressModel.streetAddress= "";
|
||||||
self.showAddressFields = true;
|
self.showAddressFields = true;
|
||||||
|
|
||||||
for (const component of place.address_components) {
|
for (const component of place.address_components) {
|
||||||
|
|
@ -276,8 +278,7 @@ export default ({
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "route": {
|
case "route": {
|
||||||
self.addressModel.streetAddress +=
|
self.addressModel.streetAddress += " " + component.short_name;
|
||||||
" " + component.short_name;
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "locality": {
|
case "locality": {
|
||||||
|
|
@ -286,7 +287,6 @@ export default ({
|
||||||
}
|
}
|
||||||
case "administrative_area_level_1": {
|
case "administrative_area_level_1": {
|
||||||
self.addressModel.state = component.short_name;
|
self.addressModel.state = component.short_name;
|
||||||
// self.addressModel.state = "";
|
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
case "postal_code": {
|
case "postal_code": {
|
||||||
|
|
@ -311,12 +311,12 @@ export default ({
|
||||||
const pacContainer = document.querySelector(".pac-container");
|
const pacContainer = document.querySelector(".pac-container");
|
||||||
pacContainer.remove();
|
pacContainer.remove();
|
||||||
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
// Failed to fetch script
|
// Failed to fetch script
|
||||||
console.log("Unable to load Google Places API script");
|
console.log("Unable to load Google Places API script");
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue