2

I am using AngularJS login form. I noticed that 1/10 times that the password is being sent partially if the user pressed the enter key really quickly. For example, if the password is "happygolucky", it will send instead "happy."

I can't seem to find a similar problem posted elsewhere and am at a lost as to why it occurs in the first place.

This is the form that I am using: 

<form name="loginForm" novalidate ng-submit="loginFormDirectiveCtrl.login()">
  <div class="form-group" ng-class="{ 'has-error': loginForm.email.$dirty && loginForm.email.$error.required }">
        <label for="email">Company Email</label>
        <input type="text" name="email" id="email" class="form-control" ng-model="loginFormDirectiveCtrl.email"
               required/>
        <span ng-show="loginForm.username.$dirty && loginForm.email.$error.required"
              class="help-block">Company email is required</span>
    </div>
    <div class="form-group"
         ng-class="{ 'has-error': loginForm.password.$dirty && loginForm.password.$error.required }">
        <label for="password">Password</label>
        <input type="password" name="password" id="password" class="form-control"
               ng-model="loginFormDirectiveCtrl.password" required/>
        <span ng-show="loginForm.password.$dirty && loginForm.password.$error.required"
              class="help-block">Password is required</span>
    </div>
    <button class="login-button" type="submit"
            ng-disabled="loginForm.$invalid || loginFormDirectiveCtrl.loading">
        <span ng-hide="loginFormDirectiveCtrl.loading">LOGIN</span>
    </button>
</form>
Sangwin Gawande
  • 7,658
  • 8
  • 48
  • 66
user123
  • 45
  • 6
  • i have same experience but when used an codebar pistols who on every read it also send an enter key. But not when user normally type and enter so quickly. – Jesus Carrasco Aug 14 '17 at 22:26
  • @JesusCarrasco Can you elaborate what you mean? In your case, the password includes a new line character when there is a codebar pistols? And what is a codebar pistols if you don't mind explaining? Thanks! – user123 Aug 14 '17 at 22:28
  • i mean, i have a similar situation with a texbox sku, when an article is scanned with a pistol. it also fire the submit, and sometimes sku are very large and i trigger the submit befere the ng-model completes. thats what a i mean. – Jesus Carrasco Aug 14 '17 at 22:31
  • @JesusCarrasco I see. Unfortunately, I do not have a situation with a textbox sku, but I will double check if there is something else that fires the submission before ng-model completes. Thanks for the suggestion :) – user123 Aug 14 '17 at 22:37
  • not fire twice i mean if sku was 100002 some times sends 1000 like in your password. – Jesus Carrasco Aug 14 '17 at 22:38
  • Gotcha. I will look into what causes the submission before ng-model completes. – user123 Aug 14 '17 at 22:40

1 Answers1

1

What a do for the example i told in the comments was creating a directive. like this.

.directive('inputDelayEnter', ['$timeout',
  function($timeout) {
    return {        
        require:'^?ngModel', 
        link: function (scope, element, attrs, ngModelCtrl) {
            element.bind('keydown keypress', function (event) { 
                if(event.which === 13) {                    
                     $timeout(500);
                    if(ngModelCtrl.$modelValue !== undefined){
                      scope.$apply(function (){
                          scope.$eval(attrs.coppelDelayEnter);
                      });
                    }

                }
            });
        }
    };
  }
])​;

HTML 

<input type="text" ng-model="data.sku" input-delay-enter>

i think it can help if you only change type to password.

Jesus Carrasco
  • 1,355
  • 1
  • 11
  • 15