jQuery yazı serialize ve $.

7 Cevap php

I'm trying to send a lot of data from a form using the $.post method in jQuery. I've used the serialize() function first to make all the form data into one long string which I will then explode serverside. The weird thing is when I try and send it using $.post it appends the result of the serialize() to the URL as if I was sending it using GET. Anyone have any ideas why this is happening?

İşte jquery bulunuyor:

$("#addShowFormSubmit").click(function(){
  var perfTimes = $("#addShowForm").serialize();
  $.post("includes/add_show.php", {name: $("#showTitle").val(), results: perfTimes }, function(data) {
    $("#addShowSuccess").empty().slideDown("slow").append(data);
  });
});

Burada php bulunuyor:

$show = $_POST['name'];
$results = $_POST['results'];
$perfs = explode("&", $results);
foreach($perfs as $perf) {
    $perf_key_values = explode("=", $perf);
    $key = urldecode($perf_key_values[0]);
    $values = urldecode($perf_key_values[1]);
}
echo $key, $values;

7 Cevap

Eğer serialize ve ajax etkinleştirmek için bir <button> elemanı kullanılarak, ve <button> elemanı form elemanı içinde ise, {[(3)] Eğer } otomatik olursa olsun jQuery ile onu vermek ne başka. atama tıklatın, bir form gönderme gibi davranır.

Ve bir form eleman belirtilen hiçbir eylem özniteliği durumunda, bu başvuru sadece aynı sayfa üzerine geri veri gönderir. Yani size ajax GET kullanıldığı gibi sıralanmış veri URL görünen birlikte, bir sayfa yenileme görerek sona erecek.

İki çözümleri:

1 - <form> elemanının dış <button> elemanı hareket:

Önce:

<form id='myForm'>
    <!--Some inputs, selects, textareas, etc here-->
    <button id='mySubmitButton'>Submit</button>
</form>

Sonra:

<form id='myForm'>
    <!--Some inputs, selects, textareas, etc here-->
</form>
<button id='mySubmitButton'>Submit</button>

2 - diğer kullanıcılar tarafından önerildiği gibi, (bu varsayılan eylemi) teslim olmaktan formu engellemek için düğmeye tıklatma işleyicisi içine preventDefault() ekleyin:

$("#addShowFormSubmit").click(function(event){
  event.preventDefault();
  var perfTimes = $("#addShowForm").serialize();
  $.post("includes/add_show.php", {name: $("#showTitle").val(), results: perfTimes },      function(data) {
    $("#addShowSuccess").empty().slideDown("slow").append(data);
  });
});

Açıkçası tüm kodunuzu görmeden, ben bu sorunla ilgili durum ise hiçbir fikrim yok, ama göndermek düğmesi <button> çünkü sen açıklayan şimdiye davranışı gördük tek nedeni budur.

Ne veri URL'ye eklenir inanmak götürür?

Neyse, form verileri kendisi form değerleri geçmek daha mantıklı değil mi? Bu "patlayabilir" adımı atlamak için izin verir:

$("#addShowFormSubmit")
  .click(function() { 
      var perfTimes = $("#addShowForm").serialize(); 
      $.post("includes/add_show.php", 
         $.param({name: $("#showTitle").val()}) + "&" + perfTimes, 
         function(data) {...}); 
  });

Yani bu muhtemelen biraz kalın kafalı, ama ben düzeltmeleri bir demet her zaman yapma yorgun geldiğimden beri bana bu çok şeyi yapmanıza yardımcı bir işlev yaptı. Ben PhP yeniden sahip olmak istediği tüm bir ilişkisel dizi oldu zaman, nesneler bir koleksiyon sağlar çünkü serializeArray tür can sıkıcı bir durum. Aşağıdaki fonksiyonu tefrika dizi üzerinden gidecek ve bir değeri varsa, sadece uygun özelliklere sahip yeni bir nesne inşa edecek.

İlk olarak, bu fonksiyon (söz konusu formun kimliği alır):

function wrapFormValues(form) { 
    form = "#" + form.attr("id") + " :input";
    form = $(form).serializeArray();
    var dataArray = new Object();

    for( index in form)
    { 	
    	if(form[index].value) 	{
    		dataArray[form[index].name] = form[index].value; 	
    	}
    }		

    return dataArray; 
}

Benim mesaj inşa ederken ben genelde form verilerini önce iki ya da üç diğer değerlere etiketlemek beri ben de genellikle bir nesne kullanmak ve bunu inline onu tanımlamak için daha temiz görünüyor, bu yüzden son adım bu benziyor:

var payload = new Object(); 
//stringify requires json2.js from http://www.json.org/js.html
payload.data = JSON.stringify(data);

$.post("page.php", payload,  
    function(reply) {
    	//deal with reply.
    });

Sunucu tarafı olan $payload = json_decode($_POST['data'], true) yapmak zorunda ve kendinizi tuşları form alanlarının isimleri bir ilişkisel dizi var hepsi.

Tam reddi olsa, birden seçer muhtemelen burada çalışmaz, büyük ihtimalle sadece listede son hangisi değer olacaktı. Bu da benim projelerinden birini karşılamak için çok özel olarak oluşturulan, bu yüzden size uygun çimdik isteyebilirsiniz. Örneğin, ben sunucusundan benim bütün cevapları için json kullanabilirsiniz.

Bu sözdizimi deneyin. WCF hizmeti ajax çağrısı ile bir form ve POST seri için kullanabilirsiniz. Ayrıca, yerine nesne sen yol inşa tek bir JSON nesnesi bu geri gönderebilirsiniz. Bu deneyin:

var serializedForm = serializedForm = $("#addShowForm").serializeArray();

$.post("includes/add_show.php", 
    {
        "myObjectName": ("#showTitle").val(), results: perfTimes 
    }, function(data) 
        {
            $("#addShowSuccess").empty()
            .slideDown("slow")
            .append(JSON.stringify(serializedForm)); 
        });

Php tarafında, parse_str içine bakmak isteyebilirsiniz. Eğer 2. isteğe bağlı parametre kullanmak eğer değişkenler, veya bir diziye içine url dizeyi ayrıştırmak olacaktır.

Bu sorun için bir daha mümkün nedeni: formu doldurarak sırasında "ENTER" tuşuna bastığınızda atadığınız teslim eylem, her türlü olmadan bir form varsa, form geçerli URL sunulacaktır, olacak o kadar Eğer bir GET ajax işlemi kullanarak sanki sıralanmış veri URL görürsünüz. Bu sorunun basit bir çözüm, sadece kendi basıldığında formu göndererek basın önlemek için:

//Prevent Form Submission when Pressing Enter
$("form").bind("keypress", function(e) {
if (e.keyCode == 13)
    return false;
});

yerine, tefrika ve serializeArray () () kullanmayı deneyin. serializeArray () JSON veri yapısını üretir ise (), bir url kodlu bir sorgu dizesi üretecek hale.

etiketler