title: AngularJS form validation - at least one input with value - add class
body: <p>I have a form where at least one input must contain data, so I'm using the following to disable the submit until at least one input has data:</p>
  
  <pre><code>&lt;form novalidate&gt;
    &lt;input type="text" ng-model="caption.topCap" id="topCap" class="pull-left" required&gt;
    &lt;input type="text" ng-model="caption.bottomCap" id="bottomCap"&gt;
    &lt;input type="submit" value="Caption It" class="btn btn-block btn-success btn-lg" ng-disabled="!(caption.topCap || caption.bottomCap)"&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>This is the controller:</p>
  
  <pre><code>capApp.controller('captionFormController', ['$scope', function($scope) {
    $scope.master = { topCap: "Top Line", bottomCap: "Bottom Line" };
    $scope.update = function(caption) {
      $scope.master = angular.copy(caption);
    };
    $scope.reset = function() {
      $scope.caption = angular.copy($scope.master);
    };
    $scope.reset();
  }]);
  </code></pre>
  
  <p>The problem is that I cannot use <code>required</code> on the fields because only one or the other is required, therefore I never get a class of <code>ng-invalid</code> added to the input, so although both fields might be empty, and I have a disabled submit button, I want to have a class added if both fields are empty.</p>
  
  <p>Is there a way to have a class added to the fields, if they have been touched but are both empty? They are prefilled on page load by the way.</p>