title: How to validate with JQUERY real-time
body: <p>I got an issue. I want to be able to validate data in multiple forms on my website with JQUERY in real time. For example, I have a "add customer" form, I want to be able to disable the Submit button until all the fields are validated. And validation has to occur in real time, meaning after every mouse move, key up key down, page load and all that other stuff. Another example is when I click on "Edit Customer" for one of my current customers. A Modal pops up with a form that has all current information already entered. The Submit button has to be active because all the fields are already validated. If I remove the first name for example, the Submit button has to get disabled.
  Validation occurs on many ways, I am using formance to validate phone numbers and emails.</p>
  
  <p>Either way, I already got something working but it's buggy. I wanna know what the best way to go about doing this? Am I doing it right? Here's an example:</p>
  
  <pre><code>$(document).on('click focus focusin focusout hover keydown keypress keyup load', function() {
  if ($("#customer-add-form input[name='phoneNumber']").formance('validate_phone_number') &amp;&amp;
      $("#customer-add-form input[name='email']").formance('validate_email') &amp;&amp;
      $("#customer-add-form input[name='zipCode']").formance('validate_number') &amp;&amp;
      $("#customer-add-form input[name='city']").val().length &gt;= 2 &amp;&amp; 
      $("#customer-add-form input[name='firstName']").val().length &gt;= 2 &amp;&amp; 
      $("#customer-add-form input[name='lastName']").val().length &gt;= 2 &amp;&amp; 
      $("#customer-add-form input[name='companyName']").val().length &gt;= 2 &amp;&amp; 
      $("#customer-add-form input[name='address']").val().length &gt;= 2){
          $("#customer-add-form input[type='submit']").prop("disabled", false);
  } else {
      $("#customer-add-form input[type='submit']").prop("disabled", true);
  } 
  }
  </code></pre>