title: form validation in ajax before submitting form through ajax
body: <p>Im using ajax to submit a form and inserting the values to the database..I tried many ways but validation error check doesnt come out right.
  here is my code</p>
  
  <pre><code>$(document).ready(function() {
    $('body').on('click', '#Submit', function(e) {
      e.preventDefault();
      var formData = new FormData($(this).parents('form')[0]);
  
      $.ajax({
        url: 'formrelay.php',
        type: 'POST',
        xhr: function() {
  
          var myXhr = $.ajaxSettings.xhr();
          return myXhr;
        },
        success: function(data) {
          document.getElementById('Message').innerHTML = data;
        },
        data: formData,
        cache: false,
        contentType: false,
        processData: false
      });
      return false;
    });
  });
  </code></pre>
  
  <p>I tried using submithandler (saw in one of the tutorial) but it did not work..pls help..code below</p>
  
  <pre><code> $(document).ready(function(){
       $("#relay_form").validate({
         rules: {
              f_name: { required : true }
            },
  
          submitHandler : function (form) {
                             e.preventDefault();
              var formData = new FormData($(this).parents('form')[0]);
  
              $.ajax({
                  url:'form_relay.php',
                  type: 'POST',
                  xhr: function() {
  
                      var myXhr = $.ajaxSettings.xhr();
                      return myXhr;
                  },
                  success: function (data) {
                      document.getElementById('Message').innerHTML=data;
                  },
                  data: formData,
                  cache: false,
                  contentType: false,
                  processData: false
              });
              return false;
            }
      });
  
      });
  </code></pre>