Form change and validity in angularjs


Whenever any non-readonly input in my form changes and the form is valid, I want to do certain action. Let’s say, my form looks like

<form name="form" novalidate>
    <input ng-model='input.a' required/>
    <input ng-model='input.b' required/>
    <input value='{{output.p | number: 2}}' readonly/>
    <input value='{{output.q | number: 2}}' readonly/>

Now upon any change of input, I want to do something, whenever input.a and input.b are valid. I tried $watch(input), but it didn’t work. Watching all its members does, but it feels stupid. Adding ng-change to all fields feels better, but still pretty stupid (non-DRY). What’s the proper way?

The other question is how to find out if the input is valid. If I had a button, I could do simply

<button ng-click="doIt()" ng-disabled="form.$invalid">

but how can I access form.$invalid in the controller (it’s not contained in $scope)?


You should be able to access form.$invalid by doing


See here: AngularJs can't access form object in controller ($scope)

To watch for changes in the form, you should be able to do:


Answered By – dave

Answer Checked By – Candace Johnson (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.