jQuery: serialize () formularz i inne parametry

115

Czy możliwe jest wysyłanie elementów formularza (serializowanych .serialize()metodą) i innych parametrów za pomocą jednego żądania AJAX?

Przykład:

$.ajax({
    type : 'POST',
    url : 'url',
    data : {
        $('#form').serialize(),
        par1 : 1,
        par2 : '2',
        par3: 232
    }
}

Jeśli nie, to jaki jest najlepszy sposób na przesłanie formularza wraz z innymi parametrami?

Dzięki

KenavR
źródło

Odpowiedzi:

236

serialize() skutecznie zamienia wartości formularza w prawidłowy querystring, jako taki możesz po prostu dołączyć do ciągu:

$.ajax({
    type : 'POST',
    url : 'url',
    data : $('#form').serialize() + "&par1=1&par2=2&par3=232"
}
Rory McCrossan
źródło
7
@Falcon co masz na myśli z kokosa tutaj?
Shafizadeh
jak mogę zmienić 1 na zmienną
Slatan-ko
3
@Shafizadeh Its a rhyme (alot - coconut)
Adam
Czy możesz powiedzieć, dlaczego tutaj nie ma potrzeby contentType? Czy to jest dodawane domyślnie?
kernal lora
Tak, adres URL formularza jest kodowany domyślnie. Zobacz dokumentację jquery, aby uzyskać więcej informacji
Rory McCrossan,
77

Alternatywnie możesz użyć form.serialize()with, $.param(object)jeśli przechowujesz parametry w jakiejś zmiennej obiektu. Zastosowanie byłoby następujące:

var data = form.serialize() + '&' + $.param(object)

Więcej informacji można znaleźć pod adresem http://api.jquery.com/jQuery.param .

kliszaq
źródło
10
Podoba mi się ten. To znaczy, że nie muszę patrzeć na brzydkie querystring!
Greg Woods
4
To zdecydowanie lepszy sposób. Przyjęta odpowiedź jest niechlujna i nigdy nie powinna być używana w żadnej aplikacji produkcyjnej.
FastTrack
3
Jeśli mówimy o środowisku produkcyjnym, żadnej z tych odpowiedzi nie należy używać. formPowinno zawierać wszystkie informacje (w ukrytych pól w razie potrzeby), dzięki czemu można go serializacji w jednym połączeniu. W ten sposób, jeśli JS jest wyłączony lub zawiedzie, przesyłanie formularza powinno nadal być bezpieczne i zawierać wszystkie dane po wysłaniu.
Rory McCrossan
9

Nie wiem, ale żadne z powyższych nie działało dla mnie, wtedy użyłem tego i zadziałało:

W serializowanej tablicy formularza jest on przechowywany jako para klucz-wartość

Wprowadziliśmy nową wartość lub wartości tutaj w postaci zmiennej, a następnie możemy teraz bezpośrednio przekazać tę zmienną.

var form = $('form.sigPad').serializeArray();
var uniquekey = {
      name: "uniquekey",
      value: $('#UniqueKey').val()
};
form.push(uniquekey);
Rohit Arora
źródło
1

Jeśli chcesz wysłać dane z serializacją formularza, możesz spróbować tego

var form= $("#formId");
$.ajax({
    type: form.attr('method'),
    url: form.attr('action'),
    data: form.serialize()+"&variable="+otherData,
    success: function (data) {
    var result=data;
    $('#result').attr("value",result);

    }
});
4302836
źródło
0

przekazać wartość parametru w ten sposób

data : $('#form_id').serialize() + "&parameter1=value1&parameter2=value2"

i tak dalej.

Sanjay
źródło
0

Zgodnie z odpowiedzią Rory'ego McCrossana , jeśli chcesz wysłać tablicę liczb całkowitych (prawie dla .NET), oto kod:

// ...

url: "MyUrl",       //  For example --> @Url.Action("Method", "Controller")
method: "post",
traditional: true,  
data: 
    $('#myForm').serialize() +
    "&param1="xxx" +
    "&param2="33" +
    "&" + $.param({ paramArray: ["1","2","3"]}, true)
,             

// ...
Dani
źródło
-1

Możesz utworzyć pomocniczy formularz używając jQuery z zawartością innego formularza, a następnie dodać go z innych parametrów, więc musisz tylko serializować go w wywołaniu ajax.

function createInput(name,value){
    return $('<input>').attr({
        name: name,
        value: value
    });
}
$form = $("<form></form>");
$form.append($("#your_form input").clone());
$form.append(createInput('input_name', 'input_value'));
$form.append(createInput('input_name_2', 'input_value_2'));
....

$.ajax({
    type : 'POST',
    url : 'url',
    data : $form.serialize()
}
Felixuko
źródło
-1

Naprawiam problem ze stwierdzeniem under; wysyłaj dane z adresem URL w tej samej metodzie GET

$.ajax({
    url: 'includes/get_ajax_function.php?value=jack&id='+id,
    type: 'post',
    data: $('#b-info1').serializeArray(),

i uzyskaj wartość za pomocą $_REQUEST['value']OR$_GET['id']

Aziz Fazli
źródło
-1

Możesz również użyć funkcji serializeArray, aby zrobić to samo.

Suresh Prajapat
źródło