Form Validation

[r0610205]

Directive works perfect on submit, however it doesn't work with form validations. Especially if 'submit' button disabled until form is valid. What do you think about updating model at the time directive compiled with a small timeout like this:

link: function(scope, elem, attrs, ngModel) {
    var origVal = elem.val();
    $timeout(function () {
          var newVal = elem.val();
          if(ngModel.$pristine && origVal !== newVal) {
              ngModel.$setViewValue(newVal);
          }
    }, 500);
    scope.$on('autofill-submit', function(e) {
        ngModel.$setViewValue(element.val());
    });
}

[chesleybrown]

I'm not a fan of the timeout solutions because they don't guarantee functionality and they slow down the responsiveness of your site. Which is why I wrote this directive without timeouts. If you could give me example code that replicates the issue you're describing I can take a look at finding another solution.

[r0610205]

I actually agree about timeout, I don't like it neither. The problem is that browsers don't emit any sort of event on autofill, so I think there is no way to detect change without timeout in this case. Which means form validation coupled with special markup for required fields and disabling submit buttons simply won't work.

Here is the example http://plnkr.co/edit/dxdR0aRdgSVtAIkwes9G?p=preview
Make browser to autofill e-mail field for you. As you can see e-mail field would be marked as invalid, because obviously user model is empty.