title: Validate only visible controls in AngularJS
body: <p>I'm new to AngularJS and perhaps I'm going about this the wrong way, but I'm having problems validating a form.</p>
  
  <p>I have one form containing multiple DIVs. Each DIV represent a page in the form flow. I've got  a single Next-button to take the user to the next page (DIV).</p>
  
  <p>A page is shown based on a "currentpage" field in the $scope, e.g. </p>
  
  <pre><code>&lt;form&gt; 
      &lt;div ng-show="currentpage == 1"&gt;
          &lt;input type="text" required /&gt;
      &lt;/div&gt;
      &lt;div ng-show="currentpage == 2"&gt;
          &lt;input type="text" required /&gt;
      &lt;/div&gt;
      &lt;button ng-disabled="??" ng-click="next()" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I want a click on the Next-button to trigger form validation on the visible DIV controls only, and not the hidden ones. Disabling the Next button based on the visible controls' validation status is perfect. But how? I would very much like to avoid using JQuery in my controller.</p>
  
  <p>Thanks!</p>