jQuery: Bir kullanma

Ben bir php komut dosyası ajax bir veritabanında saklanır bazı içerik göndermek için çalışıyorum. Ben jQuery framework kullanıyorum. Ben bilgi göndermek için bir sayfadaki bir bağlantıyı kullanmak istiyorum. Ben sorun bilgi gönderebilir ve alabilir işlevi yazma yaşıyorum, ben denedim her şey asimptotik olduğunu.

EDIT The idea is that the user will click the link, and a coulumn called "show_online" (a tiny int) in a table called "listings" will update to either 1 or 0 (**a basic binary toggle!) On success, specific link that was clicked will be updated (if it sent a 1 before, it will be set as 0).

EDIT Bir sayfada bu bağlantıların 20-30 olacak. Ben benzersiz bir kimliği ('Onlinestatus') ile her içeren div belirledik. Doğrusu her örneği için ayrı bir js işlevi olmazdı.

Herhangi bir yardım çok takdir edilmektedir. Gerekli kod aşağıda.

<script type="text/javascript"> 
    function doAjaxPostOnline( shouldPost, bizID ){
    	load("ajaxPostOnline.php?b='+bizID+'&p='+shouldPost", jsonData, callbackFunction);
function callbackFunction(responseText, textStatus, XMLHttpRequest)
{
  // if you need more functionality than just replacing the contents, do it here
}

    	}
    }
</script>   


<!-- the link that submits the info -->: 
<div id='onlineStatus<?php echo $b_id ?>'>
<a href='#' onclick="doAjaxPostOnline( 0, <?php echo $b_id ?> ); return false;" >Post Online</a>
</div>

ajaxPostOnline.php

<!-- ajaxPostOnline.php ... the page that the form posts to -->
<?php
    $id = mysql_real_escape_string($_GET['b']);
    $show = mysql_real_escape_string($_GET['p']);

    if( $id && ctype_digit($id) && ($show == 1 || $show == 0) ) {
    	mysql_query( "UPDATE listing SET show_online = $show
    	WHERE id = $id LIMIT 1" );
    }

    if($result) {
    	if($show == '0'){
    		$return = "<a class='onlineStatus' href='#' onchange='doAjaxPostOnline( 1, <?php echo $b_id ?> ); return false;' >Post Online</a>";
    	}
    	if($show == '1'){
    		$return = "<a class='onlineStatus' href='#' onchange='doAjaxPostOnline( 0,  $b_id ); return false;' >Post Online</a>";
    	}
    	print json_encode(array("id" => $id, "return" => $return));
    }
?>

4 Cevap

JQuery load () fonksiyonu, bu tür bir şey için gerçekten iyidir.

İşte bir örnek. Temelde, bir kap gibi bir dış div var. Sen html döndüren bir betik / hizmet diyoruz. Eğer ajax arama daha sonra sevk edecektir bir kimliği ile bu html bir div var. Yedek div kapsayıcı div iç html değiştirir. Sen yük yöntemine ikinci parametre olarak bir json nesnesi olarak veri geçmek ve üçüncü parametre olarak bir geri çağırma işlevine bir başvuru iletebilirsiniz. Geri çağırma işlevi cevabı (ayrıca ayrıştırma / işleme tam yanıt metin, http durum kodu, ve bu ajax çağrısı ile ilişkili XMLHttpRequest nesnesi) bilgilerin her türlü parça alırsınız.

$("#id_of_some_outer_div").load("somepage.php #id_of_replacement_div", jsonData, callbackFunction);

function callbackFunction(responseText, textStatus, XMLHttpRequest)
{
  // if you need more functionality than just replacing the contents, do it here
}

böylece, sizin durumunuzda bağlantıları yerine bahsediyoruz. Operasyonun her iki tarafında bir div içindeki orijinal bağlantı koyun.

Burada yük için jQuery API doc link () var:

load

EDIT:

Tek geçişte birden değiştirmeleri yapıyor ilgili yorumuna cevaben:

Sen geri çağırma işlevi sizin için tüm çalışmaları yapmak olabilir.

  1. Değiştirilmesi gereken tüm divlere benzersiz bir css sınıf ekleyin. Bu, tek seferde hepsini seçmenizi sağlayacak. Bu html elemanları (ki içinde "c" CSS demek ne) birden fazla css sınıfı olabilir unutmayın. Eğer $("div.replace_me"), bu replace_me tarzı ile tüm divlere bir koleksiyon olacak bir değişken seti var ise, hepsi, <div id="[some unique id]" class="replace_me"... Sonra olurdu.
  2. Ajax çağrısı (onlar başka bir div konteyner ya da sadece bir tek "bir" eleman ister) gelen unsurlar bunlar sokulacak konum konteynere benzer bir benzersiz bir kimliği olmalıdır olursa olsun. Örneğin, bir kap ve div_replace1 div_replace1_insert en id sokulacak öğenin kimlik olurdu;
  3. Geri arama fonksiyonu içerisine kullanarak değiştirmeleri üzerinde yineleme $("div.replace_me").each(function(){ ...
  4. Her yinelemenin içindeki "bu" anahtar kelime geçerli madde anlamına gelir. Bu öğenin id kapmak, şimdi eklemek istediğiniz öğenin benzersiz kimliği var replacement_id = this.id + "_insert"; (yukarıdaki örnekte olduğu gibi) gibi bir değişken var. $("#" + replacement_id) şimdi size eklemek istediğiniz öğe için bir referans verecek. this.html( $("#" + replacement_id) );: Böyle ekleme şey yapabilirsiniz

Eğer (bu test değil) Yukarıdaki kod düzenlemek zorunda kalabilirsiniz, ama bu genel bir fikir olacaktır. Siz "her" ile sayfa öğeleri yineleme, sayfadaki elemanlara ajax dönüş veri unsurları ilişkilendirmek için adlandırma kuralları kullanabilirsiniz, ve (this.html ile değiştirebilirsiniz)

Eğer gerçekten ajax başarı dönüş fonksiyonu olarak ilan etmek demek

function(html)

? .. Ben belki 'veri' olarak param için demek düşünüyorum?

Php komut json dönen beri json için dataType ayarlamanız gerekir. Yazmış kod örneği, başarı işlevi olduğunu unutmayın () dışında $. Ajax () olduğunu ve bunun içinde olması gerekir.

 $.ajax({
   url: "ajaxPostOnline.php?b=" + bizID + "&p=" + shouldPost,
   dataType: "json",
   success: function(json){
     $("#onlineStatus" + bizID).html(json.return);
   }
 });

Eğer bu özel durum için daha özlü beri getJSON yöntemini kontrol etmek isteyebilirsiniz.

$.getJSON("ajaxPostOnline.php", {b:bizID, p:shouldPost}, function(json) {
    $("#onlineStatus" + bizID).html(json.return);
});

EDIT: Orijinal soru düzenlenmiş ve sağlanan örnek ölçüde değişti. Ben hala $. GetJSON yöntem öneriyoruz.

Ben yanlış sürece, bu AJAX ve sunucu tarafı komut dosyası karıştırma bir hata var gibi görünüyor.

Yani $ dönüş yerde ajaxPostOnline.php (pek, o AJAX! Denir ise) içinde atama pasajı sonra ayrıştırılan PHP bağlıdır.

$return = "<a class='onlineStatus' href='#' onchange='doAjaxPostOnline( 1, <?php echo $b_id ?> ); return false;' >Post Online</a>";

Elbette bu olmalıdır:

$return = "<a class='onlineStatus' href='#' onchange='doAjaxPostOnline( 1, ".$id." ); return false;' >Post Online</a>";