Navigate back to the homepage

How to disable autocomplete in material-ui Textfield

Infinitbility
React
October 9th, 2021 · 1 min read
How to disable autocomplete in material-ui Textfield

Hello Friends 👋,

Welcome To Infinitbility! ❤️

I tried autocomplete="off", autoComplete="off" and many more but many browsers like Mozilla, Google or Edge are still showing autocomplete and auto-fill data to my input box, and then I found an article after hours of research and now I’m going to show how I can disable autocomplete and auto-fill.

Let’s start today’s tutorial How to disable autocomplete in material-ui Textfield

I found Mozila MDN Documentation where Documentation exaplaining why many modern browsers do not support autocomplete=“off” for login fields something like inputs.

So the reason is

Modern browsers implement integrated password management: when the user enters a username and password for a site, the browser offers to remember it for the user. When the user visits the site again, the browser autofills the login fields with the stored values.

The solution is you have to use autocomplete="new-password";

Autocomplete new-password exampe in material-ui

1<TextField
2 autoComplete="new-password"
3/>

Thanks for reading…

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Tutorials

React Native

Categories

More articles from Infinitbility

How to detect notch in react native

How to detect notch in react native

React Native DeviceInfo hasNotch example

September 30th, 2021 · 1 min read
How to detect device is emulator in react native

How to detect device is emulator in react native

React Native DeviceInfo isEmulator example

September 29th, 2021 · 1 min read
© 2020–2021 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]