How to suppress helpful (but unwanted) droplists on your phone

Wappler General How To
#1

Hi, I wonder if anyone has encountered this. My app is nearing completion and I am testing it in various browsers and environments, though I have not tried PWAs yet (they are on my to do list).

So at teh moment I am testing the app on a phone or tablet by running it in a browser. On my android phone the browser is Chrome. It looks and runs well on the phone, I am very pleased with Wappler on this point.

The problem comes when I am entering records into my app on the phone, from the 2nd record onwards. Whenever I click into a text box, even if it is not a Select box, Chrome tries to help by giving me a selection of values previously entered into the same text box in previous records.

But in this context, this is not helpful, in fact it obliterates parts of the screen the user needs to see.

So the question is, how to suppress this helpful (but not helpful) behavior by chrome or perhaps any browser. The answer has to be something in wapplers control, not a chrome or android setting, because users will not want to change their chrome or android settings just to run a wappler app. Any suggestions?

Ironically, Select boxes do not have this problem, they only list the choices defined in my app.

#2

Try adding autocomplete="new-password" to the input.

<input type="email" class="form-control form-control-sm" id="inputUser" name="inputUser" aria-describedby="input1_help" placeholder="Kopar Email Address" autocomplete="new-password">

You can also add it to the form tag to prevent autocomplete in the whole form.

#3

Thanks Brad. Following your example I ended up with
input id=“txtAnswer01” name=“txtAnswer01” type=“text” class=“form-control form-control-sm” autocomplete=""

But it did not work, Also tried adding the autocomplete at form level, also did not work. Also tried some text between the quotes, also no difference.

Note this unwelcome behavior only happens when teh user first clicks into the text box. Once the user starts typing something, chrome’s popup help disappears. But nevertheless the problem is not trivial.

#4

Try setting autocomplete="off" to your inputs.

#5

Should be autocomplete=“new-password” … autocomplete=“off” no longer works in latest Chrome I believe. new-password should work. I currently use it.

#6

Teodor, that worked great, Brad, I did try “new-password” but that did not work, possibly I am on an slighty older version of chrome.

Would there be anything wrong if it put…
autocomplate=“off” autocomplete=“new-password”

to cover all versions of Chrome. Do other browsers need any consideration for this?

#7

Chrome (from what i read) ignores autocomplete="off" for login forms where you have your form names like username, email, passwrord etc.

That is not correct, it should be added only once, so if autocomplete="off" works for you, just keep it like that.

2 Likes
#8

Thank you, will do

#9

That could be. I use it on a login form. :beers:

#10

Brad, I am just reading the stackoverflow you pointed me to. I think I am picking up that “new-password” only works when the text input Name=Username or Password or Email, otherwised use “off” for autocomplete. I may be wrong, but its a battle I will fight another day, “off” will do for now in my context.

1 Like