title: jQuery form validation
body: <p>I have been working on this jQuery form which would only allow the user to submit once all fields are filled in. So essentially, the submit field (or in my case the 'request' field) is dimmed until all fields are not blank. My button is always dimmed though, would someone help me with this please? I have the following jQuery:</p>
  
  <pre><code>$(function() {
      var $submit = $(".request input");
      var $required = $(".required");
      function containsBlanks(){
          var blanks = $required.map(function(){ return $(this).val() == "";});
          // the inArray helper method checks if value is within an array
          return $.inArray(true, blanks) != -1;
      }
  
      function requiredFilledIn(){
          if(containsBlanks()) 
          $submit.attr("disabled","disabled");
      else 
          $submit.removeAttr("disabled");
      }
  
      $("#form2 span").hide();
      $("input").focus(function(){
          $(this).next().fadeIn("slow");
      }).blur(function(){
          $(this).next().fadeOut("slow");
      }).keyup(function(){
          //Check all required fields.
          requiredFilledIn();
      });
  
      requiredFilledIn();
  });
  </code></pre>
  
  <p>This is my form </p>
  
  <pre><code>    &lt;div id="form2" title="Request a Call-back"&gt;
          &lt;p class="validateTips"&gt;All form fields are required. The submit button will activate once this is done.&lt;/p&gt;
          &lt;form action="includes/requestcall.php" method="post"&gt;
              &lt;fieldset&gt;
                  &lt;label for="name"&gt;Name:&lt;/label&gt;
                  &lt;input type="text" name="name" id="name" size="30" class="required" /&gt;
                  &lt;span&gt;Please enter your Name&lt;/span&gt;
                  &lt;br /&gt;
                  &lt;br /&gt;
                  &lt;label for="number"&gt;Number:&lt;/label&gt;
                  &lt;input type="text" name="number" id="number" size="30" class="required" /&gt;
                  &lt;span&gt;Please enter your number&lt;/span&gt;
                  &lt;br /&gt;
                  &lt;br /&gt;
                  &lt;label for="time"&gt;Preferred Time:&lt;/label&gt;
                  &lt;input type="text" name="time" id="time" size="30" class="required" /&gt;
                  &lt;span&gt;Please enter your preferred time&lt;/span&gt;
                  &lt;br /&gt;
              &lt;/fieldset&gt;
              &lt;p class="request"&gt;
              &lt;input type="submit" value="Request" class="btn-submit"&gt;
              &lt;/p&gt;
          &lt;/form&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>I'm still learning jQuery and any help would be much appreciated. </p>