1

I have a form with a username and password field and a login button. The login button is only enabled when the username field is not empty.

However when Chrome autofills the fields the login button stays disabled until I click somewhere on the page.

How can I make my app recognise that the username is not blank.

I created this javascript, which executes after the fields have been populated:

$timeout(function(){
            var field= angular.element('#username');
            if (field.length && field.val().length > 0) {
                var button= angular.element('#login_button');
                button.removeClass('disabled');
            }
        }, 1000);

But it doesn't work because field.val() is always just read as an empty string.

Urbycoz
  • 7,247
  • 20
  • 70
  • 108
  • 1
    I think this is a known Chrome bug, I've run into a number of sites where they thought the password wasn't entered when Chrome auto-filled it. – Barmar Jun 14 '18 at 15:47
  • Possible duplicate of [Detecting Browser Autofill](https://stackoverflow.com/questions/11708092/detecting-browser-autofill) – Guillaume Serrat Jun 14 '18 at 15:50
  • @GuillaumeSerrat That question is from 2012. Surely things are different now. – Urbycoz Jun 14 '18 at 15:53
  • @Urbycoz one of the solutions seems to still be relevant: The :-webkit-autofill CSS pseudo-class matches when an element has its value autofilled by the browser – Guillaume Serrat Jun 14 '18 at 16:00

0 Answers0