Using $pristine on form validation AngularJS

Question

I have a form with some angular validation, which I don't want to run at page load. Here is a stripped down example of my form:

<form ng-submit="vm.submit()" name="form" novalidate>
    <input class="form-control" ng-model="vm.userName" required />
    <button ng-disabled="form.$invalid && !form.vm.userName.$pristine" type="submit">Log In</button>
</form>

I'm attempting to turn off initial validation with !form.vm.userName.$pristine, as the user won't have touched the username text box yet. However, this isn't working and the form validates as usual on page load. Am I missing something?

You can also use form.$pristine which is more general, in case you have more than one input field — rave
– rave, Commented Oct 5, 2015 at 20:44

dfsq · Accepted Answer · 2015-10-05 20:18:05Z

2

You need to give input a name, so that ngFormController can register this element under and its validation rules. Then you would be able to check form.userName.$pristine:

<form ng-submit="vm.submit()" name="form" novalidate>
    <input class="form-control" name="userName" ng-model="vm.userName" required />
    <button ng-disabled="form.$invalid && !form.userName.$pristine" type="submit">Log In</button>
</form>

answered Oct 5, 2015 at 20:18

dfsq

193k26 gold badges244 silver badges261 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using $pristine on form validation AngularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related