Browsers Auto Fill

Anyone know how to stop your browser from autofilling forms? I’ve created a page where a user can update their info, address, phone, name etc. But when viewed safari auto populates some of the fields. I don’t want to turn it off for the browser itself as I do use the feature and I don’t want to have my users turn it off. So just trying to figure out how to stop this from happening. The yellow highlighted fields are whats being pre-populated by safari.

Also I only have safari so i’m assuming internet explorer, chrome, etc will do the same.

1 Like

You could insert an html block on the page that runs a piece of script to search for input fields and set the “autocomplete=off” parameter.

Preferably, go at the higher form element and set it there using;
<script>$("form").attr('autocomplete', 'off');</script>

3 Likes

Thank you for the idea, I tried that way but I may be doing it wrong, as it is not working

@philippe1 some thoughts:

  • Ensure your form element has an ID attached to it called “form”
  • Ensure the form has been rendered on the screen when this script is run. Is the “form” visible when the page is loaded or is it revealed later or in a popup?
  • Try adding a # symbol before “form”. Ie $("#form")
1 Like

Oops I assumed the script had some kind of catchall, I’m bad at js and got lazy :grimacing:

This one is working, thank you so much

EDIT: not working on another page that is slower to load
Tried this to manage the delay but not helping so far
image

Hmm yes it’s an issue because the element is not rendered yet. Try this?

<script>
$(document).ready(function() {
    $("#searchInput").attr('autocomplete','off');
});
</script>

Rob

1 Like

thank you so much!
Not working now.
I think I know why: I had an issue with the autocomplete plugin and had to delay my search input display.
Any idea of another trigger to delay this script as well? Maybe when the #searchInput is visible / ready? let me dig my .Js haha

1 Like

Yes. You can only work with an element via its ID after it becomes visible once. You got this! I often wait till an element is visible to run certain WFs

thanks, do you have a selector in mind? :grimacing:

Did you give it an ID?

the input? yes it’s #searchInput

The dilemma: trying to select an element before it’s rendered. Two options I’d explore:

  1. Not sure if this will work but try, at page load, selecting all inputs (assuming you don’t mind disabling autocomplete for all inputs?) jQuery ref. It might only work for rendered items so maybe no good, but worth a try.
<script>
$(document).ready(function() {
    $(":input").attr('autocomplete','off');
});
</script>
  1. Failing that, only run the script when the target input box is clicked (hopefully the script runs before the autocomplete shows up)…
1 Like

Thanks again!

No success with number #1 so far, I will dig a bit…
I tried this for number 2, doesnt work either

    <script>
    $("#SearchInput" ).click(function() {
        $("#SearchInput").attr('autocomplete','off');
    });
    </script>

@Bubble could you just add a checkbox for autocomplete=off ? :sweat_smile:

4 Likes

+1 For a disable autocomplete option please. This is catching me out with address searches with the browser autocomplete showing over the google results

3 Likes

also this should be native