javascript - Setting Bootstrap Error Class via AngularJS on Form Submit? -

how can efficiently set error state of multiple form field after user submits form?

i can set error state enough on constant basis. described in this thread use following html code:

<div class="control-group" ng-class="{ error: groupform.textbox_group.$invalid }">   <label class="control-label" for="textbox_group"><i class="icon-home"></i> organization</label>   <div class="controls controls-row">     <input type="text" class="span6" id="textbox_group" name="textbox_group" placeholder="organization" ng-model="org" required>   </div> </div> 

my issue appear in error state on page loading. want appear normal before user hits submit , then, if $invalid flagged.

i'm using individual flags, along lines of:

<div class="control-group" ng-class="{ error: group.isinvalid }">   <!-- snip --> </div>  <div class="control-group" ng-class="{ error: date.isinvalid }">   <!-- snip --> </div> 

it works, seems bloated me. there more streamlined way flag form fields in $invalid state, after form submitted?

you can create scope variable defaults false tracks when button clicked.

$scope.formsubmitted = false 

the on form add ng-submit directive change condition true.

<form name='myform' ng-submit="formsubmitted=true" > 

now change ng class condition:

ng-class="{ error: date.isinvalid && formsubmitted }"