Отправка данных jQuery.ajax одновременно с отправкой формы

Question

У меня есть немного загадки. У меня есть форма, которая имеет множество полей. Существует одно поле для ссылок, в котором вы вводите ссылку, нажимаете кнопку добавления, и ссылка (с помощью jQuery) добавляется в массив link_array. Я хочу, чтобы этот массив отправлялся через метод jQuery.ajax при отправке формы. Если я отправлю link_array, используя $ .ajax, вот так:

    $.ajax({
        type: "POST",
        url: "add_stock",
        dataType: "json",
        data: { "links": link_array }
        });

когда выбрана кнопка добавления ссылки, данные без проблем переносятся в правильное место и корректно помещаются в БД. Если я привяжу вышеуказанную функцию к кнопке отправки формы, используя $ (# stock_form) .submit (....., тогда отправляются остальные данные формы, но не link_array.

Я, очевидно, могу передать массив ссылок обратно в скрытое поле в HTML, но тогда мне придется распаковать массив в значения, разделенные запятыми, и разбить строку через запятую в PHP. Просто кажется, что в 100 раз проще распаковать массив Javascript на PHP без лишней суеты.

Итак, как получается, что вы можете отправить массив из javascript, используя $ .ajax одновременно с остальными данными $ _POST в HTML?

Обратите внимание, что я использую фреймворк Kohana 3.0, но на самом деле это не должно иметь значения, я хочу добавить этот массив js в уже запущенный массив $ _POST.

Спасибо!

Answer 1

Если вы действительно хотите отправить форму (например, с обновлением страницы и т. Д.), Единственный вариант - добавить в форму серию полей <input type='hidden'> с именем links и заполнить каждое из них одно из значений из массива. Тогда то, что вы получите на другом конце, будет по сути тем, что вы получите с помощью своего $.ajax звонка выше.

Если вы просто хотите отправить данные на сервер, но вам не нужно отправлять форму, вы можете использовать serialize в форме, чтобы получить для нее строку в кодировке URL , затем добавьте свои ссылки в конец строки и отправьте их через ajax. Что-то вот так:

// Assuming 'link_array' is present
var data, n;

data = [$('#TheFormID').serialize()];
for (n = 0; n < link_array.length; ++n) {
    data.push("links=" + encodeURIComponent(link_array[n]));
}

$.ajax({
    type: "POST",
    url: "add_stock",
    dataType: "json",
    data: data.join("&")
});

Мы получаем начало строки в кодировке URL-адреса из serialize, инициализируем массив с ним, затем добавляем закодированные поля для каждой ссылки в нем. Затем мы используем Array#join, чтобы собрать все это в одну строку для отправки с помощью вызова ajax. (Вы можете сделать это с помощью строки concat, если хотите, но построение этих длинных строк с помощью массива происходит быстрее после определенного количества элементов и заставляет просто «поставить на него & или нет» просто выпадать и естественно.)

Answer 2

Вам больше повезет, если использовать функцию jQuery serializeArray или serialize , а затем добавить дополнительные поля, которые у вас есть, и, наконец, отправить данные POST с помощью .ajax.