Jquery AJAX, Mysql ve PHP ile yazılara sayfa yenilenmeden veri çekmek

Merhaba arkadaşlar yaptığım bir sohbet sisteminde sayfa yenilenmeden veri çekme işlemi yaptım fakat sohbette bir uye geçmiş mesajlarını okumaya çalıştığında 
1,5 saniye sonra scrollbar direk aşağı indiriyor. Yani sayfa kendini binevi yenilemiş gibi oluyor. Bunu nasıl düzeltebilirim. Yardımlarınızı rica ederim.


 

<script>
	 var user = <?=$other;?>;
	 window.clearInterval(loadConversation);
	 var loadConversation = setInterval(function (){ 
	 $.ajax({
			url: "ajax/konusma.php",
			type: "post",
			data: "user="+user,
			success: function (cevap) {
				$("#conversation").html(cevap);
			}
		});
	 },1500);
	 
	 
	$(function () { 
	$("#conversation").scrollTop($("#conversation").prop("scrollHeight"));
	});
	</script>

 

Anladığım kadarıyla sayfa ilk açıldığı zaman sohbet bölümündeki scroll'u en alta indiriyorsun. Daha sonra eski mesajları görmek istediğinde de scroll yine aşağı sabitleniyor. Bu sorunu çözmek için öncelikle Javascript kodunda ki scroll ile alakalı herşeyi silelim.

<script>
  // User
  var user = <?=$other;?>;

  // Ajax
  $.ajax({
    url: "ajax/konusma.php",
    type: "post",
    data: "user="+user,
    success: function (cevap) {
    	$("#conversation").html(cevap);
    }
  });
</script>

Eğer bu kodu kullandıktan sonra sayfa ilk açıldığında ve eski mesajlar açıldığında sorun yoksa devam edelim ve sayfa açıldığında scroll'u en aşağıya sabitleyelim.

$('#conversation').animate({ 
  
  scrollTop: $('#conversation')[0].scrollHeight 
}, 1000);

Bu adımların sonunda kodumuzun tamamı aşağıdaki gibi olacaktır.

<script>
  // User
  var user = <?=$other;?>;

  // Ajax
  $.ajax({
    url: "ajax/konusma.php",
    type: "post",
    data: "user="+user,
    success: function (cevap) {
    	$("#conversation").html(cevap);
    }
  });

  // sayfa ilk açıldığında scroll'u aşağıya sabitleyelim.
  $('#conversation').animate({ 
    
    scrollTop: $('#conversation')[0].scrollHeight 
  }, 1000);
</script>

 

Merhaba hocam öncelikle yanıtınız için teşekkür ederim, Biz şimdi scrollbar sabitledik fakat scrollbar dan uye bir önceki mesajlarını okuyamayacak. Scrollbar üzerinden(scrollbar yukarı çıkınca) mesaj okunmasını istiyorum. tüm verileri sorunsuz çekiyor. ve Kullanıcının üzerini tıkladığımızda oluşan sohbet tablosunuda saniye 1 yeniliyor. Şuan sizin verdiğiniz kodla sabitlendi bu sefer yukarı çıkmıyor nasıl bir yol izlenebilir ? 

Yazdığım kodlarda Scroll'un sadece bir kere yani sayfa açıldığında aşağı sabitlenmesi lazım. Yukarı çıkması içinde scroll kullanması lazım. 

Hocam malesef olmadı. Size hatayı mesajda video olarak gönderdim.

Videoyu izledim. Sanırım mesaj detay sayfasını her saniye yeniletiyorsunuz. Bu yüzden de yazdığınız Scroll kodu her saniye çalışıyor ve Scroll'u kontrol edemiyorsunuz.

Çözüm için Scroll kodunu, AJAX sayfasının içine değil, mesaj detay sayfasına yerleştirmeniz gerekiyor.

Bu sayfada da sadece sayfa ilk açıldığı zaman çalışacak. Eğer kullanıcıya tıklanıldığında scroll'un en alta sabitlenmesini istiyorsak da trigger kullanmamız gerekecek.

Aşağıdaki kodu çalışmanıza göre düzenleyerek ilerleyebilirsiniz.

$('#arkadasListesi a').click(function (e) {
  
  // burası arkadaş seçildikten sonra çalışacak.
});

 

Cevap Yaz

Cevap yazabilmek için üye girişi yapmanız gerekiyor!

Yukarı Git