title: AngularJS Form Validation and Submit
body: <p>Codepen link: <a href="http://codepen.io/anon/pen/mVyPaw" rel="nofollow noreferrer">http://codepen.io/anon/pen/mVyPaw</a></p>
  
  <p>Need to create an angular app (w/ 1 controller) that validates that this form has all three fields filled out &amp; Submit button can only be enabled if the form is valid. Don't need to use the preprocessors.</p>
  
  <pre><code>&lt;div class="container" ng-app="myApp" ng-controller="formCtrl"&gt;
  
    &lt;h1&gt;&lt;span&gt;&lt;img src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/15309/angular-logo.svg" alt="Angular.js Logo" /&gt;&lt;/span&gt; Angular.js - Web Form&lt;/h1&gt;
  
    &lt;form role="form" name="form" id="contact-form"&gt;
      &lt;div class="form-group"&gt;
        &lt;label for="FirstName"&gt;First name&lt;/label&gt;
        &lt;input type="text" class="form-control" name="FirstName" id="FirstName" placeholder="enter first name" ng-model="firstName"&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
        &lt;label for="LastName"&gt;Last Name&lt;/label&gt;
        &lt;input type="text" class="form-control" name="LastName" id="LastName" placeholder="enter last name" ng-model="lastName"&gt;
      &lt;/div&gt;
  
      &lt;div class="form-group"&gt;
        &lt;label for="EmailAddress"&gt;Email address&lt;/label&gt;
        &lt;input type="email" class="form-control" id="EmailAddress" name="EmailAddress" placeholder="enter email" ng-model="emailAddress" ng-model-options="{ updateOn: 'blur' }"&gt;
      &lt;/div&gt;
  
      &lt;div class="checkbox"&gt;
        &lt;label&gt;
          &lt;input type="checkbox" required&gt; Check me out
        &lt;/label&gt;
      &lt;/div&gt;
  
      &lt;button type="submit" class="btn btn-default" ng-model="submitButton"&gt;Submit&lt;/button&gt;
  
    &lt;/form&gt;
  
  &lt;/div&gt;
  </code></pre>