jQuery for submitting a form via AJAX?

Question

Is there any magic jquery method that will allow you to submit a form to its action URL via AJAX rather than with an page reload?

I know you can bind a form's submit event to a handler function, but I'm also looking for something that will automatically serialize the form's request variables into the $.post's data element in the same as the browser does, and then fire off an ajax post or get. (the specific problem I'm trying to solve is to "ajaxify" an existing form)

Answer 1

Yes there is jquery.form plugin. All you need is to put this in the DOM ready callback:

$('#myForm').ajaxForm();

Answer 2

You can indeed - there's a plugin for it...

http://jquery.malsup.com/form/

If you don't want to use a plugin and have a fairly simple form, you can loop through the form to create a request using $.ajax instead.

Answer 3

SUBMIT FORM USING AJAX JQUERY PLUG-IN

Answer 4

I am usually make this:

$(document).submit(function(){
  var form = $(this);
  $.post( form.attr('action'),
  form.serialize(),
  function(data){
    // do something with response 
  });

  return false;

}