diff --git a/src/fmg-components/address-questions/address-questions.vue b/src/fmg-components/address-questions/address-questions.vue index ebe9967fe..8f67fa48a 100644 --- a/src/fmg-components/address-questions/address-questions.vue +++ b/src/fmg-components/address-questions/address-questions.vue @@ -259,7 +259,7 @@ export default { if (autocompleteResultsContainer) { streetAddressField.appendChild(autocompleteResultsContainer); } - }); + }, { once: true }); this.addressField1.addEventListener("keydown", (e) => { // When the user presses a key in the Street Address field, immediately disable autocomplete for that field. @@ -287,22 +287,27 @@ export default { // }); this.addressField1.addEventListener("input", (e) => { - console.log(`input event`); - console.log(e); + // console.log(`input event`); + // console.log(e); + + this.$nextTick(() => { + switch (e.inputType) { + case "insertText": + case "insertFromPaste": + case "deleteContentBackward": + // If the user enters text by typing, or pasting text, or deleting text already entered, disable *autofill* + this.disableAutoFill(); + break; + default: + // If the user enters text by *autofill* then disable the *autocomplete* + //this.showAddressFields = true; + //this.addressField1.dispatchEvent(new Event("change")) + this.unloadAutocomplete(); + } + }); + + - switch (e.inputType) { - case "insertText": - case "insertFromPaste": - case "deleteContentBackward": - // If the user enters text by typing, or pasting text, or deleting text already entered, disable *autofill* - this.disableAutoFill(); - break; - default: - // If the user enters text by *autofill* then disable the *autocomplete* - //this.showAddressFields = true; - //this.addressField1.dispatchEvent(new Event("change")) - this.unloadAutocomplete(); - } }); }, disableAutoFill() { @@ -450,8 +455,9 @@ export default { // Temporary const element = document.getElementsByClassName("address-questions")[0]; element.addEventListener("change", (e) => { - console.log(`change event`); - console.log(e); + // console.log(`change event`); + // console.log(e); + if (this.showAddressFields) { return false; } @@ -459,13 +465,25 @@ export default { let autoFilledInputs = []; autoFilledInputs = element.querySelectorAll("input:-webkit-autofill"); - this.showAddressFields = autoFilledInputs.length > 0; + + console.log(this.addressModel.city); + this.$nextTick(() => { + this.showAddressFields = autoFilledInputs.length > 0; + console.log(this.addressModel.city); + console.log(document.getElementById("city").value) + }) + console.log(this.addressModel.city); + console.log(document.getElementById("city").value) + + if (this.showAddressFields) { this.unloadAutocomplete(); } this.addressField1.classList.remove("has-icon"); - }); + }, + // { once: true } + ); }, beforeUpdate() { // It is necessary to set focus on the street address on this lifecycle hook when this component is used in a modal.