How to display a div tag if any form errors exist in angular?

Question

I know how to do one off validations in angular. What I am looking to do is to display a warning at the top of the page if any errors exist in the below forms that were trying to submit. How do I accomplish this?

Is there a form.$errors? For if any error occurs on the page?

So can I do something like this?

<div id="errorInfoHeader" ng-show="formName.$errors">

restassured · Accepted Answer · 2015-02-10 18:24:50Z

4

Yes, you're on the right track:

formName.$invalid

is what you're looking for.

<div id="errorInfoHeader" ng-show="formName.$invalid">

See this plunkr that demonstrates what you're trying to do: http://plnkr.co/edit/9Ny58FY9rv74sxXryKmh?p=preview

edited Feb 10, 2015 at 18:24

answered Feb 10, 2015 at 17:39

restassured

1,0182 gold badges9 silver badges12 bronze badges

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

3 Comments

Demodave Over a year ago

Ok, question this sort of seems to work, but only after the form is declared. If the div tag is before the form. It doesn't execute. So how do I get it to execute.

restassured Over a year ago

In your controller, you can bind formName.$invalid to another variable on the scope. Then use that variable to show/hide your errorInfoHeader.

Demodave Over a year ago

Found it I had a different controller declared in between

kruczy · Accepted Answer · 2015-02-10 17:39:08Z

1

You can use $valid like this:

<div id="errorInfoHeader" ng-show="formName.$valid">

answered Feb 10, 2015 at 17:39

kruczy

7914 silver badges8 bronze badges

Collectives™ on Stack Overflow

How to display a div tag if any form errors exist in angular?

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related