jQuery post () z serializacją i dodatkowymi danymi

Próbuję dowiedzieć się, czy możliwe jest publikowanie serialize()i inne dane spoza formularza.

Oto, co myślałem, że zadziała, ale wysyła tylko 'wordlist'dane formularza, a nie dane.

$.post("page.php",( $('#myForm').serialize(), { 'wordlist': wordlist }));

Czy ktoś ma jakieś pomysły?

Możesz użyć serializeArray ^[docs] i dodać dodatkowe dane:

var data = $('#myForm').serializeArray();
data.push({name: 'wordlist', value: wordlist});

$.post("page.php", data);

Spróbuj $ .param

$.post("page.php",( $('#myForm').serialize()+'&'+$.param({ 'wordlist': wordlist })));

Alternatywne rozwiązanie, na wypadek, gdybyś musiał to zrobić podczas przesyłania pliku Ajax:

var data = new FormData( $('#form')[0] ).append( 'name' , value );

LUB jeszcze prostsze.

$('form').on('submit',function(e){

    e.preventDefault();
    var data = new FormData( this ).append('name', value );

    // ... your ajax code here ...

    return false;

});

Jeśli chcesz dodać obiekt javascript do danych formularza, możesz użyć następującego kodu

var data = {name1: 'value1', name2: 'value2'};
var postData = $('#my-form').serializeArray();
for (var key in data) {
    if (data.hasOwnProperty(key)) {
        postData.push({name:key, value:data[key]});
    }
}
$.post(url, postData, function(){});

Lub jeśli dodasz metodę serializeObject () , możesz wykonać następujące czynności

var data = {name1: 'value1', name2: 'value2'};
var postData = $('#my-form').serializeObject();
$.extend(postData, data);
$.post(url, postData, function(){});

W nowej wersji jquery można to zrobić w następujący sposób:

• pobierz tablicę parametrów przez serializeArray()
• połączenie push() lub podobne metody w celu dodania dodatkowych parametrów do tablicy,
• call, $.param(arr)aby uzyskać serializowany ciąg, który może być użyty jako parametr jquery ajax data.

Przykładowy kod:

var paramArr = $("#loginForm").serializeArray();
paramArr.push( {name:'size', value:7} );
$.post("rest/account/login", $.param(paramArr), function(result) {
    // ...
}

$.ajax({    
    type: 'POST',  
    url: 'test.php',  
    data:$("#Test-form").serialize(),  
    dataType:'json',
     beforeSend:function(xhr, settings){
     settings.data += '&moreinfo=MoreData';
     },
    success:function(data){
            //  json response  
    },
    error: function(data) { 
        // if error occured
    }
    });

Możesz mieć formularz zawierający dodatkowe dane jako ukryte pola, które ustawisz tuż przed wysłaniem żądania AJAX do odpowiednich wartości.

Inna możliwość polega na użyciu tego małego klejnotu do serializacji twojego formularza do obiektu javascript (zamiast ciągu) i dodania brakujących danych:

var data = $('#myForm').serializeObject();
// now add some additional stuff
data['wordlist'] = wordlist;
$.post('/page.php', data);

Możesz tego użyć

var data = $("#myForm").serialize();
data += '&moreinfo='+JSON.stringify(wordlist);

Lubię utrzymywać przedmioty jako obiekty i nie robić szalonych zmian typu. Oto moja droga

var post_vars = $('#my-form').serializeArray();
$.ajax({
  url: '//site.com/script.php',
  method: 'POST',
  data: post_vars,
  complete: function() {
    $.ajax({
      url: '//site.com/script2.php',
      method: 'POST',
      data: post_vars.concat({
        name: 'EXTRA_VAR',
        value: 'WOW THIS WORKS!'
      })
    });
  }
});

jeśli nie widzisz z góry, użyłem funkcji .concat i przekazałem w obiekcie zmienną post jako „nazwa” i wartość jako „wartość”!

Mam nadzieję że to pomoże.