AngularJS. Access form validation in sibling form

Question

I have two forms:

<div ui-view="form1">
    <form name=form1> </form>
</div>

<form name=form2> </form>

How can I access validation status of first form (which is in child scope) in second form? For example I need to disable 'submit' button for second form if first form is $invalid.

Thanks

michelem · Accepted Answer · 2015-07-24 15:30:44Z

1

This should do the trick:

JSFiddle

<form name="form1">
    <input type="text" ng-model="firstname" required />
</form>
<form name="form2">
    <button type="submit" ng-disabled="form1.$invalid">Save</button>
</form>

Please take also a look at the FormController and its properties you can use to check inputs/form statuses (dirty, pristine, valid, etc...).

edited Jul 24, 2015 at 15:30

answered Jul 24, 2015 at 15:19

michelem

14.6k5 gold badges55 silver badges67 bronze badges

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

3 Comments

Fyodor Khruschov Over a year ago

thanks for your answer. I updated the question with info about the form1 which is in child scope, created by ui-router. In this case your current answer isn't working.

michelem Over a year ago

I don't get the problem if it's a child it inherits the parent scope. Look at this JSFiddle and change it if needed jsfiddle.net/michelem09/a8q89myf

Fyodor Khruschov Over a year ago

I can't access child scope from parent

Collectives™ on Stack Overflow

AngularJS. Access form validation in sibling form

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related