ajax - When to use $.ajax(), $('#myForm').ajaxForm, or $('#myForm').submit

Question

Given so much different options to submit sth to the server, I feel a little confused.

Can someone help me to clear the idea when I should use which and why?

1> $.ajax()
2> $('#myForm').ajaxForm
3> ajaxSubmit
4> $('#myForm').submit

Thank you

Answer 1

I personally prefer creating a function such as submitForm(url,data) that way it can be reused.

Javascript:

function submitForm(t_url,t_data) {
$.ajax({
  type: 'POST',
  url: t_url,
  data: t_data,
  success: function(data) {
    $('#responseArea').html(data);
  }
});
}

HTML:

<form action='javascript: submitForm("whatever.php",$("#whatevervalue").val());' method='POST'> etc etc

edit try this then:

$('#yourForm').submit(function() {
    var yourValues = {};
    $.each($('#yourForm').serializeArray(), function(i, field) {
        yourValues[field.name] = field.value;
    });
    submitForm('whatever.php',yourvalues);
});