Disable Autocomplete for Gravity Forms

January 21, 2020: Updated snippet to be simpler and more aggressive.

January 21, 2020: Updated snippet to be simpler and more aggressive.

Overview

In my experience, autocomplete is generally more helpful than harmful but there are times when it just gets in the way. For those times, use this handy snippet to disable this feature.

  1. Overview
  2. Using the Snippet
  3. Autocomplete in Gravity Forms.
  4. How autocomplete works in different browsers.

Using the Snippet

Confirm that you have Gravity Forms installed and activated and that you’ve installed the snippet. Once you have installed the snippet, you’re good to go! This one’s plug and play!

This snippet will apply to all forms and all fields. If you’d like to only apply this to specific forms and/or specific fields, let us know in the comments.

Autocomplete in Gravity Forms.

By default, Gravity Forms outputs HTML5 fields. The HTML5 spec offers a framework for labeling fields so the browser can automatically complete forms with previously-entered information. In short, you don’t have to do anything for Gravity Forms to activate autocomplete on your forms.

There is an option in Gravity Forms’ Settings that allows you disable HTML5 output. This will disable autocomplete for those fields, but we don’t recommend it. Disabling HTML5 also removes many other useful features, such as automatically displaying a different mobile keyboard when a Phone or Email field is selected. Instead, you can use this snippet to only disable autocomplete while keeping the rest of the HTML5 goodies.

How autocomplete works in different browsers.

Autocomplete behavior differs between browsers. While HTML5 standards dictate how autocomplete should work in general, it leaves some room for interpretation. Browser manufacturers use slightly different implementations for triggering autocomplete, and while the user experience is mostly identical, the technical differences create a situation where a one-size-fits-all solution for disabling autocomplete isn’t possible.

The spec itself states that the autocomplete attribute can be added to any input, select, or textarea to change the autocomplete behavior of those fields. It furthers states that the use of the off value should disable autocomplete for that field. This works in many browsers, but not all. Below is a breakdown of how different autocomplete values are interpreted by different browsers.

offWorks in all browsers except Chrome. Chrome ignores autocomplete="off" for fields that it detects as requesting personal information (i.e. fields with labels like Name, Phone, or Address). It does respect off to non-personal-information fields.
passwordWorks in Chrome to completely disable autocomplete. Does not work in other browsers.

Because of the different behaviors in browsers, our snippet does a quick User Agent check to determine what browser is loading the form. It then assigns the appropriate autocomplete value for that particular browser. In our testing, autocomplete is disabled in all browsers on both desktop and mobile.

Find a browser where autocomplete is still active with the snippet installed? Drop us a line.

Comments

    1. Samuel Bassah
      Samuel Bassah Staff December 12, 2022 at 4:28 am

      Hi Casey,

      I just did a test, and it appears to work on iPhone using Safari. Could you please check if the snippet is properly added to the website? You can contact us via our support form if you can still not get it working for you so we can assist you further.

      Best,

  1. matteo
    matteo July 27, 2022 at 12:23 pm

    Hi there. Thanks for your job. I would like to keep the autocomplete on all field, a part from email confirmation field. Any hint? thx again

    Reply
    1. Dario Space
      Dario Space Staff July 27, 2022 at 12:29 pm

      Hi Matteo,

      This will require some digging by our developers. You can reach out via our support form if you have an active Gravity Perks license.

      Best,

    2. Cathy
      Cathy August 1, 2022 at 7:15 pm

      I am looking for this same functionality and assume many others are as well. Seems like it would be a very common need to not autofill an email confirmation field. Thanks!

  2. PWIA Webmaster
    PWIA Webmaster February 10, 2022 at 11:13 pm

    So this did not work. I copied the code to the functions.php to the bottom of the file. I also tried Code Snippets still did not work. I know this is a blank statement, and impossible to troubleshoot. But basically, regardless of the browser (chromium or whatever), the cached address list still shows up. I’m not going to put the URL publicly. But I do have an account with your so logs should be there. Let me know what else I can do to help.

    Reply
    1. Samuel Bassah
      Samuel Bassah Staff February 11, 2022 at 4:31 am

      Hi,

      I just did a test with the code, and it works as expected. I’ve sent you a reply via email.

      Best,

    2. PWIA Webmaster
      PWIA Webmaster February 24, 2022 at 1:50 am

      Problem is that it doesn’t work with the latest Microsoft Edge Based of Chromium. I tested in a bunch of other browsers, no issues. Here is what the useragent returns Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/98.0.4758.102 Safari/537.36 Edg/98.0.1108.56

    3. Samuel Bassah
      Samuel Bassah Staff February 24, 2022 at 8:19 am

      Hi,

      I’m still unable to recreate this issue. It works also on the latest version of Egde. I’ve sent you an email with more information on my findings.

      Best,

  3. John joseph Raslavsky
    John joseph Raslavsky June 2, 2021 at 8:56 pm

    I am getting this error.

    ‘Your PHP code changes were rolled back due to an error on line 717 of file /www/wp-content/themes/enfold/functions.php. Please fix and try saving again.

    syntax error, unexpected ‘<‘, expecting end of file’

    Reply
  4. Moses
    Moses March 23, 2021 at 4:43 pm

    Hello friends! Thank you for the code.

    I couldn’t make it work yet. I’m running DIVI. I’ve followed their instructions on how to add code snippets to their theme (by using a code snippet plugin) but it doesn’t seem to be working.

    Any advice? Moses

    Reply
    1. Ryan Donovan
      Ryan Donovan August 11, 2020 at 5:04 pm

      Hello Alice, to add to one form, you’ll want to update the filter names to gform_form_tag_123 and gform_field_content_123 respectively, where 123 is your form ID. As for a particular form and field, update the filter name to target your form and field: gform_field_content_FORMID_FIELDID.😃

  5. Ekas
    Ekas August 6, 2020 at 10:10 am

    Hi Ryan, thanks for your code, I’m able to remove the auto fill on form with your code above but change autocomplete=’off’ to autocomplete=’new-password’

    and I also have try using this code and works on all page (at least on my end) $(‘input’).attr(‘autocomplete’,’new-password’);

    I’m not a real developer, just share if some one sturgle with this issue :)

    Reply
  6. Eric Kazda
    Eric Kazda May 7, 2020 at 4:03 pm

    Here is an even easier way that is more customer friendly.

    Add a class to the gravity form’s “Custom CSS Class” field… something like “no-autocomplete”.

    Then add the following to your site’s JS file:

    jQuery(document).ready(function($) { $(“.no-autocomplete input”).attr(‘autocomplete’, ‘off’); });

    Reply
  7. Trey Gallant
    Trey Gallant April 20, 2020 at 5:56 pm

    Is there an easy way to disable the autofill for multiple forms? I saw how to apply it to an individual form, but didn’t see a reply for applying it to more than one.

    Reply
    1. David Smith
      David Smith Staff November 4, 2019 at 5:04 pm

      Hi Russell, this is working for me. Do you have an example I could take a look at on your end?

    2. Russell Davies
      Russell Davies November 4, 2019 at 5:13 pm

      Hi David,

      Thanks for replying this is the form I am trying to stop the autocomplete on but the code didn’t work. Could this be a caching issue?

      I am using avada theme.

      Thanks

      Russell

    1. David Smith
      David Smith Staff October 3, 2019 at 12:00 pm

      You’ll want to update the filter names to gform_form_tag_123 and gform_field_content_123 respectively, where 123 is your form ID.

  8. Lee Fuller
    Lee Fuller May 12, 2019 at 12:27 pm

    Something I’ve noticed. If you turn off the “Enable Locator button” option, the code no longer functions. Turning it back on makes it work again.

    Just fyi.

    Reply
    1. Lee Fuller
      Lee Fuller May 12, 2019 at 1:04 pm

      Interesting.. when I add another single text field, it stops working. Even if I add a specific form and field.

    1. David Smith
      David Smith Staff February 27, 2019 at 10:49 am

      Hi Mart, same snippet but update the filter name to target your form and field: gform_field_content_FORMID_FIELDID.

    2. ben Horle
      ben Horle January 3, 2020 at 7:07 am

      So where does this bit go please? I need to disable it on feild 9, on form 8. So how can I do that please? Also when the time comes, how would I then ad additional fields on other forms please? field: gform_field_content_FORMID_FIELDID. ‘, ‘ autocomplete=”off”>’, $form_tag ); } return $form_tag; } add_filter( ‘gform_field_content’, ‘gform_form_input_autocomplete’, 11, 5 ); function gform_form_input_autocomplete( $input, $field, $value, $lead_id, $form_id ) { if ( is_admin() ) return $input; if ( GFFormsModel::is_html5_enabled() ) { $input = preg_replace( ‘/<(input|textarea)/', '

  9. Dave F
    Dave F November 29, 2018 at 4:59 pm

    I got google Chrome to NOT do autofill by making the following changes to the code provided:

    1) Removed the HTML5 condition for the code

    2) Changed autocomplete=off to autcomplete=something-new per the recommendations I found here: https://stackoverflow.com/questions/47775041/disable-autofill-in-chrome-63

    FYI, that Stack Overflow link/lead was provided in a different comment.

    Anyway, now it’s working for me the way I want. If there are any disadvantages to removing the HTML5 condition for the code, let me know, but so far so good.

    I’m pasting the code I’m using in the “Code” box, since it’s not allowed in the comment section.

    Reply
    1. Ewomazino Donald
      Ewomazino Donald August 21, 2019 at 11:14 am

      Hello Dave, I would really like to see the plugin snippet as its not displayed here. By the way does it still work?

    1. David Smith
      David Smith Staff April 19, 2017 at 7:34 am

      Autofill is different than autocomplete and Chrome does not respect the autocomplete attribute for autofill.

    2. Ed
      Ed March 22, 2018 at 11:24 am

      Try this it worked on some of my multi-page form but on the page where I had gravity-pdf preview it had no effect on the remaining address and email fields and in fact those reset the preview proving where this autofill was messing with earlier entries on other pages of the form. I still don’t know how to block it from happening it makes my extensive multi page form useless.

      https://organicweb.com.au/16112/wordpress/disable-chrome-autofill/

  10. Dave
    Dave January 11, 2017 at 10:24 am

    Hi, I am interested in using this code in my theme to disable Auto Complete in my Gravity Forms but the theme’s function file is limited and states not to enter any coding in it. Is there an alternative way please?

    Thank you

    Reply
  11. Sam Mitzmann
    Sam Mitzmann December 22, 2016 at 2:38 am

    Hey David, How can I use this feature for specific fields in a form? It is necessary in conjunction with Auto-complete perk so that the browser auto-fill does not interfere with that function (especially on mobile). Alternatively to automatically disable browser auto-fill for all fields where auto-complete perk is active.

    Reply
    1. David Smith
      David Smith Staff December 23, 2016 at 3:48 pm

      Hey Sam, drop me a line via support and I’ll update GP Auto-complete to automatically disable the HTML autocomplete.

  12. Cieran
    Cieran November 17, 2016 at 7:04 am

    Any way this could be modified for autocapitalize? And preferably to turn off autocapitalize AND autocomplete for a specific field (like email address, especially for mobile users)?

    Reply
    1. David Smith
      David Smith Staff November 17, 2016 at 8:36 am

      Sure, Cieran. Duplicate the snippet and everywhere you see “autocomplete”, replace it with “autocapitalize”.

  13. Sam
    Sam July 6, 2016 at 9:08 am

    Is there a way to disable autocomplete for a field type (like the date field) or for a specific field in a specific form?

    Reply
    1. David Smith
      David Smith Staff July 14, 2016 at 7:56 pm

      We don’t have a ready solution for this but thanks for the suggestion. We’ll see if other users need this too and update the article accordingly.

    2. Marnick
      Marnick December 6, 2019 at 2:19 am

      Is there a solution for this? I need it too. As soon as you click in the box of the date field, I got all kind of auto fill options that has nothing to do with a date. Because of the list, it is hard to actually see the calendar too. Weird that there are not a lot more people having this issue.

    3. David Smith
      David Smith Staff December 9, 2019 at 9:39 am

      Hi Marnick, this snippet should work for Date fields, but it will also work for all other fields. If you find that it isn’t working, feel free to share a URL where I can see the issue.

  14. Grant
    Grant June 3, 2015 at 5:18 pm

    Hi Jordan/David,

    I hope this message finds you! I put the code into the functions.php, enabled HTML5, but it doesn’t seem to be working for me. Anything I can do to get this to work? I’m using the following versions:

    PHP Version 5.3.29 MySQL Version 5.1.56 WordPress Version 4.2.2 Gravity Forms Version 1.9.9

    Thanks!

    Reply
    1. Grant
      Grant June 5, 2015 at 9:40 am

      Thanks for replying David! Unfortunately I already did use the raw version, and it didn’t work for me. Any other thoughts on a fix?

    1. David Smith
      David Smith Staff November 3, 2014 at 8:58 am

      This article is for browser-powered auto complete where previously submitted data is saved by the browser and then suggested to the user when they begin to type into fields. Similarly, you can override the default auto-complete with your own and provide your own data to auto-suggest. I have a perk in the works which you can see here:

      http://www.screencast.com/t/RFsnB5xrg

      If you’d like to give this perk a try, pick up a copy of Gravity Perks and drop me a line via the support form requesting access to this unreleased perk.

  15. Weekly Roundup: October 31, 2014 &ndash; Sell with WP October 31, 2014 at 2:01 am

    […] another handy Gravity Forms snippet from Gravity Wiz: Disable auto-complete for your […]

    Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

  • Trouble installing this snippet? See our troubleshooting tips.
  • Need to include code? Create a gist and link to it in your comment.
  • Reporting a bug? Provide a URL where this issue can be recreated.

By commenting, I understand that I may receive emails related to Gravity Wiz and can unsubscribe at any time.

Download Snippet

Disable Autocomplete for Gravity Forms

This field is for validation purposes and should be left unchanged.