Stop Mobile Safari from trying to auto-fill the location box

This change prevents the "No items to show" popup that obscures the first
couple suggested matches.
This commit is contained in:
Eddy G
2025-07-01 19:06:48 -04:00
parent b49433f5ff
commit 13621b6f46
5 changed files with 11 additions and 7 deletions

View File

@@ -26,7 +26,7 @@ const categories = [
'Postal', 'Populated Place',
];
const category = categories.join(',');
const TXT_ADDRESS_SELECTOR = '#txtAddress';
const TXT_ADDRESS_SELECTOR = '#txtLocation';
const TOGGLE_FULL_SCREEN_SELECTOR = '#ToggleFullScreen';
const BNT_GET_GPS_SELECTOR = '#btnGetGps';

View File

@@ -296,7 +296,7 @@ class AutoComplete {
// if a click is detected on the page, generally we hide the suggestions, unless the click was within the autocomplete elements
checkOutsideClick(e) {
if (e.target.id === 'txtAddress') return;
if (e.target.id === 'txtLocation') return;
if (e.target?.parentNode?.classList.contains(this.options.containerClass)) return;
this.hideSuggestions();
}

View File

@@ -94,17 +94,22 @@ body {
font-family: "Star4000";
}
#txtAddress {
#txtLocation {
width: calc(100% - 170px);
max-width: 490px;
font-size: 16pt;
min-width: 200px;
display: inline-block;
// Ensure consistent styling across light and dark modes
background-color: white;
color: black;
border: 2px inset #808080;
@media (prefers-color-scheme: dark) {
background-color: #000000;
color: white;
border: 1px solid darkgray;
border: 2px inset #808080;
}
}

View File

@@ -21,7 +21,7 @@ page.on('console', messageFormatter);
const tester = async (location, testPage) => {
// Set the address
await testPage.type('#txtAddress', location);
await testPage.type('#txtLocation', location);
await setTimeout(500);
// get the page
await testPage.click('#btnGetLatLng');

View File

@@ -64,9 +64,8 @@
<body<% if (query && query['settings-kiosk-checkbox'] === 'true') { %> class="kiosk"<% } %>>
<div id="divQuery">
<input id="txtAddress" type="text" value="" placeholder="Zip or City, State" />
<input id="txtLocation" type="text" value="" placeholder="ZIP Code or City, State" data-1p-ignore />
<div class="buttons">
<button id="btnGetGps" type="button" title="Get GPS Location"><img src="images/nav/ic_gps_fixed_black_18dp_1x.png"
class="light" />