title: Ajax prevent default and submit form on current page
body: <p>I have the following script, which works perfectly BUT the problem is I need a <code>form action attribute</code> for it to work, thus my question how can I modify my current script that it prevents default form submit behaviour and <strong>submits form on current page without the need for an <code>action attribute</code> in form</strong></p>
  
  <pre><code>$(function() {
    var form = $('#editRes');
    var formMessages = $('#formMsg');
    // Set up an event listener for the contact form.
    $(form).submit(function(e) {
      // Stop the browser from submitting the form.
      e.preventDefault();
      //do the validation here
      if (!validateLog()) {
        return;
      }
      // Serialize the form data.
      var formData = $(form).serialize();
      // Submit the form using AJAX.
      $.ajax({
        type: 'POST',
        url: $(form).attr('action'),
        data: formData
      }).done(function(response) {
        // Make sure that the formMessages div has the 'success' class.
        $(formMessages).removeClass('error').addClass('success');
        // Set the message text.
        $(formMessages).html(response); // &lt; html();
        // Clear the form.
        $('').val('')
      }).fail(function(data) {
        // Make sure that the formMessages div has the 'error' class.
        $(formMessages).removeClass('success').addClass('error');
        // Set the message text.
        var messageHtml = data.responseText !== '' ? data.responseText : 'Oops! An error occured!.';
        $(formMessages).html(messageHtml); // &lt; html()
      });
  
    });
    function validateLog() {
      var valid = true;
      //VALIDATE HERE
      return valid;
    }
  })
  </code></pre>