Получите пары значений ключа формы при отправке с помощью ajax

Question

Когда форма отправлена, я предотвращу действие по умолчанию и вместо этого сделаю ajax-вызов с данными POST. Как я могу получить все данные, чтобы я мог передать их вместе с моим вызовом ajax?

Когда элемент формы отправляется обычно с помощью метода post, он легко собирает все пары name => value в форме. К сожалению, теперь, когда я делаю ajax, похоже, мне нужно собрать это самостоятельно. Я действительно не хочу писать JS, чтобы пропустить форму и построить собственный хеш, я предполагаю, что есть более простой способ с jQuery или каким-то поведением, о котором я не думаю.

JS скрипка пример формы, где мне понадобятся все значения. http://jsfiddle.net/rm9KD/

Answer 1

Использование JQuery serialize()

$.ajax({ 
     url: url, 
     data: $("form").serialize() 
    } 
); 

Как вы не предоставили специальный код, это просто пример для вас, чтобы заполнить

Answer 2

jQuery предоставляет функцию serializeArray, которая сериализует данные формы в массив. Затем вы можете взять результирующий массив и создать объект данных из него.

var arrayData = $('#myForm').serializeArray(), 
    data = {}, 
    i = 0; 
for(; i < arrayData.length; i++) { 
    data[arrayData[i].name] = arrayData[i].value; 
} 

В качестве альтернативы, JQuery предусматривает serialize функции, которая обеспечивает последовательную строку данных формы.

var data = $('#myForm').serialize(); 

Answer 3

http://jsfiddle.net/WfrM4/

$(document).ready(function() { 
    $('form').submit(function (e) { 
     // Dont trigger a page load on submit. 
     e.preventDefault(); 

     // Get all the values of the form??? 
     var form_data = $('form[name="my_awesome_form"]').serialize() 

     // Make an ajax call 
     $.ajax({ 

      url: "/ajax_form_receiver", 
      data: form_data 
     }); 
    }); 
});