title: two ng-submit events for validation on two forms in one html page
body: <p>I have two forms 'Signup' and 'Login' in one html page using only one controller in angularJS(Something similar to facebook login page). Using ng-submit event for validation for both of them, restricts one from being executed. So after doing some research on it, I used ng-submit event on the signup form and ng-click for login button in login form. It is able to validate signup form and display errors before submit event is fired. But fails to display any error message if user forgets to enter data in any field before clicking login() button for login form. Here is the template for that code: 
  <strong>HTML: Signup.html</strong></p>
  
  <pre><code>&lt;div ng-app="myApp" ng-controller="MainCtrl"&gt;
  &lt;!--LoginForm--&gt;
    &lt;div role="form" name="loginForm" novalidate&gt;
       &lt;div class="form-group" ng-class="{ 'has-error' : (submitted &amp;&amp; loginForm.inputEmail.$invalid) || loginForm.inputEmail.$invalid &amp;&amp; !loginForm.inputEmail.$pristine}"&gt;
         &lt;label for="inputEmail"&gt;Email&lt;/label&gt;
         &lt;input type="email" class="form-control" name="inputEmail" id="inputEmail" placeholder="Email" required ng-model="username"&gt;
         &lt;p ng-show="(submitted &amp;&amp; loginForm.inputEmail.$invalid) || loginForm.inputEmail.$invalid &amp;&amp; !loginForm.inputEmail.$pristine" class="help-block"&gt;Email is required&lt;/p&gt;
       &lt;/div&gt;
  
       &lt;div class="form-group" ng-class="{ 'has-error' : (submitted &amp;&amp; loginForm.inputPassword.$invalid) || loginForm.inputPassword.$invalid &amp;&amp; !loginForm.inputPassword.$pristine}"&gt;
         &lt;label for="inputPassword"&gt;Password&lt;/label&gt;
         &lt;input type="password" class="form-control" name="inputPassword" id="inputPassword" placeholder="Password" required ng-model="password"&gt;
         &lt;p ng-show="(submitted &amp;&amp; loginForm.inputPassword.$invalid) || loginForm.inputPassword.$invalid &amp;&amp; !loginForm.inputPassword.$pristine" class="help-block"&gt;Password is required&lt;/p&gt;
       &lt;/div&gt;
  
       &lt;div class="form-group"&gt;
         &lt;button type="submit" class="btn" ng-click="login(loginForm.$valid)"&gt;Login&lt;/button&gt;
       &lt;/div&gt;
    &lt;/div&gt;
  
  &lt;!--Signupform--&gt;         
    &lt;form name="signupForm" role="form" ng-submit="signupSubmit(signupForm.$valid)" novalidate&gt;
       &lt;div class="form-group" ng-class="{ 'has-error' : (submitted &amp;&amp; signupForm.firstname.$invalid) || signupForm.firstname.$invalid &amp;&amp; !signupForm.firstname.$pristine}"&gt;
         &lt;label for="firstname"&gt;First Name&lt;/label&gt;
         &lt;input type="text" name="firstname" class="form-control" id="firstname" ng-model="firstname" placeholder="" required=""&gt;
         &lt;p ng-show="(submitted &amp;&amp; signupForm.firstname.$invalid) || signupForm.firstname.$invalid &amp;&amp; !signupForm.firstname.$pristine" class="help-block"&gt;Firstname is required.&lt;/p&gt;
       &lt;/div&gt;
  
       &lt;div class="form-group" ng-class="{ 'has-error' : (submitted &amp;&amp; signupForm.email.$invalid) || signupForm.email.$invalid &amp;&amp; !signupForm.email.$pristine}"&gt;
         &lt;label for="email"&gt;Email&lt;/label&gt;
         &lt;input type="email" name="email" class="form-control" id="email" ng-model="username" placeholder="" required=""&gt;
         &lt;p ng-show="(submitted &amp;&amp; signupForm.email.$invalid) || signupForm.email.$invalid &amp;&amp; !signupForm.email.$pristine" class="help-block"&gt;Enter a valid email.&lt;/p&gt;
       &lt;/div&gt;
       &lt;div class="form-group" ng-class="{ 'has-error' : (submitted &amp;&amp; signupForm.password.$invalid) || signupForm.password.$invalid &amp;&amp; !signupForm.password.$pristine}"&gt;
         &lt;label for="password"&gt;Password&lt;/label&gt;
         &lt;input type="password" id="password" name="password" ng-model="password" required=""&gt;
         &lt;p ng-show="(submitted &amp;&amp; signupForm.password.$invalid) || signupForm.password.$invalid &amp;&amp; !signupForm.password.$pristine" class="help-block"&gt;Password is required&lt;/p&gt;
       &lt;/div&gt;
  
      &lt;button type="submit" class="btn"&gt;Sign Up&lt;/button&gt;
    &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and the controller for that is <strong>MainCtrl</strong>:</p>
  
  <pre><code>angular.module('myApp')
   .controller('MainCtrl', ['$scope',function ($scope) {
      $scope.signupSubmit = function(isValid){
        if (isValid) {
          //signup user code
  
         }
        }
  
      $scope.login = function(isValid){
        if(isValid) {
          //login user by checking user creds
        }
  
      };
    }
  ]);
  </code></pre>
  
  <p>Login view is actually embedded/included using ng-include in signup.html and uses same MainCtrl controller as signup.I want to use one form at a time. The click events for both the forms works fine and redirects me to the desired page after logging in or signing up. But It is not able to display error message for login form if user doesn't enter required data in any of the field. I was wondering if it is possible to use two forms with two different ng-submit events in one html page? or the way I have used ng-submit for one and ng-click for other is fine? If so, why it doesn't validate the login form. Looking to solve the problem angular way. Kindly help or provide pointers which can help me resolve the problem.  </p>