0

I have a login page, i want to stop autocomplete and auto fills in my form page.

By using autocomplete="off" auto fill Stopped. But autocomplete still load when i click the input fields (password or user name fields). how to stop this autocomplete ?

I tried the following methods, autocomplete="off", autocomplete="false", autocomplete="new-password" but still it came.

My sample code :

<form #f="ngForm" autocomplete="off">
  <mat-form-field floatLabel="auto">
    <mat-label>User name</mat-label>
    <mat-icon matPrefix>person</mat-icon>
    <input matInput 
           tabindex="1" 
           #username="ngModel"
           [(ngModel)]="userName" 
           required 
           name="username"
           maxlength="100" 
           autocomplete="off" 
           role="presentation">
  </mat-form-field>
  <mat-form-field floatLabel="auto">
    <mat-label>Password</mat-label>
    <mat-icon matPrefix>lock</mat-icon>
    <input matInput 
           tabindex="2" 
           [(ngModel)]="password" 
           required 
           name="password" 
           #pass="ngModel" 
           type="password" 
           maxlength="100"
           autocomplete="new-password" 
           role="presentation">
  </mat-form-field>
</form>

Google chrome version: Version 76.0.3809.100 (Official Build) (64-bit)

gpgekko
  • 3,506
  • 3
  • 32
  • 35
Sahin
  • 87
  • 1
  • 3
  • 13
  • i have experienced the same issue and couldn't find a solution , later came to understand that it is a chrome bug and depends on version of chrome you are using. The chrome for some reason overrides the settings specified in html tags – Joel Joseph Aug 16 '19 at 10:03
  • possible duplicate: https://stackoverflow.com/q/35448269/2050306 – robert Aug 16 '19 at 10:03
  • @robert that should have worked but , it didn't solve the problem form me back then – Joel Joseph Aug 16 '19 at 10:05
  • I have that same thought @Joel Joseph, but i want to know there is any tricks. – Sahin Aug 16 '19 at 10:05
  • @JoelJoseph what version of chrome? is there any bug report on this? – robert Aug 16 '19 at 10:06
  • @robert may ideas are around here, but none of that work fine, some ideas worked on client side, but once published it wont work, that why create a new question to find out different idea or it was bug on browser side. – Sahin Aug 16 '19 at 10:09
  • @robert here is thread (there are many more if you google ). The bug has been reported in different versions of chrome but the solution is still a mystery : https://bugs.chromium.org/p/chromium/issues/detail?id=914451&can=2&q=Autofill%20&colspec=ID%20Pri%20M%20Stars%20ReleaseBlock%20Component%20Status%20Owner%20Summary%20OS%20Modified and also stack overflow thread : https://stackoverflow.com/questions/15738259/disabling-chrome-autofill – Joel Joseph Aug 16 '19 at 10:16
  • Please refer my answer in this thread-> https://stackoverflow.com/questions/2530/how-do-you-disable-browser-autocomplete-on-web-form-field-input-tag , its an angular js way but can implimented in angular also – Edison Augusthy Aug 16 '19 at 10:20
  • @Edison i already tried may solution form the link u preferred, none of that work well. some ideas worked on client side, but once published it wont work. – Sahin Aug 16 '19 at 10:23
  • @Sahin Please refer my answer its located at the bottom .. am using it that in my production and its working fine for 90% of cases – Edison Augusthy Aug 16 '19 at 11:44

2 Answers2

5

Add "anystring" on autocomplete and a random name to tag.

autocomplete="anyrandomstring" name="test"
Guilherme Capitão
  • 51
  • 1
  • 3
0

autocomplete="new-password" this worked for me. Other values like false, off, randomstring didn't work.

Ankit
  • 143
  • 1
  • 8