title: AngularJS - Validation for Saving and Creating/Publishing
body: <p>We are developing an website to allow product managers save and create products. </p>
  
  <p>The save has some basic validation for any data that's been entered. 
  The create/publish has all validation including required data checks. </p>
  
  <p><strong>Is there a good way to have two different types of validation for a single form?</strong></p>
  
  <p>Below are a couple of approaches that I've tried:</p>
  
  <p><strong>ng-required</strong></p>
  
  <pre><code>&lt;input type="text" name="planName" ng-model="vm.product.planName" ng-required="vm.publishAttempt" /&gt;
  </code></pre>
  
  <p>Our save marks the form as pristine. </p>
  
  <pre><code>    function saveSuccess()
      {
          vm.editForm.$setPristine();
          vm.publishAttempt = false;
          vm.isLoading = false;
      }
  </code></pre>
  
  <p>This makes it so the form inputs with ng-required are not triggered for validation when the publish button is clicked and a true value is set to validate them. The only solution I've seen for this is to loop over the form elements and mark them as dirty. It seems like the wrong approach though.</p>
  
  <pre><code>    function publish()
      {
          vm.isLoading = true;
          vm.publishAttempt = true;
  
          angular.forEach(vm.editForm, function (field)
          {
              if (field &amp;&amp; field.$pristine != null)
              {
                  console.log(field);
                  field.$setDirty();
              }
          });
  
          setTimeout(function()
          {
              if (vm.editForm.$invalid)
              {
                  vm.isLoading = false;
                  logger.error('Required data is missing. Please check the form and try again.');
              }
              else
              {
                  if ($window.confirm('Are you sure you want to publish this product? Doing so will make this product available to everyone and any changes going forward will be considered corrections to the product. '))
                  {
                      productService.publishProduct($routeParams.productId)
                          .then(publishSuccess, publishFail);
                  }
                  else
                  {
                      vm.isLoading = false;
                      vm.publishAttempt = false;
                  }
              }
          }, 1000);
      }
  </code></pre>
  
  <p><strong>back end validation using fluentvalidation</strong></p>
  
  <p>We also have back end validation using FluentValidation. I've tried returning those results but would then have to loop over all of them and find the value on the form and mark it as invalid. </p>
  
  <pre><code>    function publishSuccess(result)
      {
          if (!result.IsValid)
          {
              angular.forEach(result.errors, function(error)
              {
                  // Map error back to input and set invalid.  
              });        
          }
          else
          {
              openDetail($routeParams.productId);
          }
          vm.isLoading = false;
      }
  </code></pre>
  
  <p>It's extremely tempting to default to jQuery for a solution but there has to be an AngularJS way that I am simply just missing. </p>
  
  <p>I'm fairly new to Angular, am I missing anything obvious? </p>