ajax ile çekilen veriler birbirine karışıyor

medesan 952 gün önce

406 defa görüntülendi

merhaba arkadaşlar, Linkteki gibi bir çalışmam var. listeden bir değer seçtiğimde varsayılan değer ile listeden yeni seçilen değerin verileri bir birine karışıyor. bu konuda yardıma ihtiyacım var. yardımcı olabilirseniz sevinirim.

Soru hatalı mı? 👎

Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!

Spam olarak işaretle

Cevaplar (4)

ebykdrms

949 gün önce

Bir hata yapmış olmalısınız. Verdiğiniz linkte JS kodlarını şu şekilde düzenlediğimde bir sorunla karşılaşmadım:

$(function(){
	IftarSahurVakti(9146);
	$('#sehirler option[value="9402"]').prop("selected", true);
});
    
// global olarak interval'i tutacak bir değişken oluşturuyorum:
var countdownInterval = null;

function IftarSahurVakti(targetLocationId)
{
    var $test = $("#imsakiye").eq(0);
    $countdownName = $test.find("#test-countdown-name");
    $countdown = $test.find("#test-countdown");

    var now = new Date();
    var tomorrow = new Date(now);
    tomorrow.setDate(tomorrow.getDate()+1);

    $.ajax({
        type:"get",
        url:"https://namaz-vakti-api.herokuapp.com/data?region="+targetLocationId,
        success:function(response){
            var todayImsak = response[0][1].split(":");
            var todayAksam = response[0][5].split(":");
            var tomorrowImsak = response[1][1].split(":");
            var todayImsakDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), todayImsak[0], todayImsak[1], 0);
            var todayAksamDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), todayAksam[0], todayAksam[1], 0);
            var tomorrowImsakDate = new Date(tomorrow.getFullYear(), tomorrow.getMonth(), tomorrow.getDate(), tomorrowImsak[0], tomorrowImsak[1], 0);

            if(now <= todayImsakDate) $countdownName.text("Sahura kalan süre:");
            else if(now > todayImsakDate && now <=todayAksamDate) $countdownName.text("İftara kalan süre:");
            else $countdownName.text("Sahura kalan süre:");

            calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
          
            // daha önce oluşturulmuş bir interval varsa onu kaldırıyorum.
            if(countdownInterval) clearInterval(countdownInterval);
          
            // Yeni oluşturacağım interval'i global interval değişkenime atıyorum.
            countdownInterval = setInterval(function() {
                calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
            },1000);
        }
    });
}

function calculateCountdown(imsakDate, aksamDate, tomorrowImsakDate, $element) {
    now = new Date();
    var targetDate = null;
    if(now <= imsakDate) targetDate = imsakDate;
    else if(now > imsakDate && now <=aksamDate) targetDate = aksamDate;
    else targetDate = tomorrowImsakDate;
    
    var hours = parseInt((targetDate - now) / (1000 * 60 * 60) % 24);
    var minutes = parseInt((targetDate.getTime() - now.getTime()) / (1000 * 60) % 60);
    var seconds = parseInt((targetDate.getTime() - now.getTime()) / (1000) % 60); 
    $element.text(hours + " saat " + minutes + " dakika " + seconds + " saniye");
}

#009648

batuhanal

948 gün önce

Bu Kadar Basit Birşeyi Bu kadar uzatmak mantıksız

fff=null;
$(function(){	

			IftarSahurVakti(9146);
			$('#sehirler option[value="9402"]').prop("selected", true);
})
    
    

function IftarSahurVakti(targetLocationId)
{
	clearInterval(fff);
  var $test = $("#imsakiye").eq(0);
  $countdownName = $test.find("#test-countdown-name");
  $countdown = $test.find("#test-countdown");

  var now = new Date();
  var tomorrow = new Date(now);
  tomorrow.setDate(tomorrow.getDate()+1);

  $.ajax({
      type:"get",
      url:"https://namaz-vakti-api.herokuapp.com/data?region="+targetLocationId,
      success:function(response){
          var todayImsak = response[0][1].split(":");
          var todayAksam = response[0][5].split(":");
          var tomorrowImsak = response[1][1].split(":");
          var todayImsakDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), todayImsak[0], todayImsak[1], 0);
          var todayAksamDate = new Date(now.getFullYear(), now.getMonth(), now.getDate(), todayAksam[0], todayAksam[1], 0);
          var tomorrowImsakDate = new Date(tomorrow.getFullYear(), tomorrow.getMonth(), tomorrow.getDate(), tomorrowImsak[0], tomorrowImsak[1], 0);

          if(now <= todayImsakDate) $countdownName.text("Sahura kalan süre:");
          else if(now > todayImsakDate && now <=todayAksamDate) $countdownName.text("İftara kalan süre:");
          else $countdownName.text("Sahura kalan süre:");

          calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
          fff = setInterval(function() {
              calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
          },1000);
      }
  });
  
}

function calculateCountdown(imsakDate, aksamDate, tomorrowImsakDate, $element) {
    now = new Date();
    var targetDate = null;
    if(now <= imsakDate) targetDate = imsakDate;
    else if(now > imsakDate && now <=aksamDate) targetDate = aksamDate;
    else targetDate = tomorrowImsakDate;
    
    var hours = parseInt((targetDate - now) / (1000 * 60 * 60) % 24);
    var minutes = parseInt((targetDate.getTime() - now.getTime()) / (1000 * 60) % 60);
    var seconds = parseInt((targetDate.getTime() - now.getTime()) / (1000) % 60); 
    $element.text(hours + " saat " + minutes + " dakika " + seconds + " saniye");
}

#009661

medesan

952 gün önce

merhaba Emre hocam cevabınız için teşekkür ederim fakat yine de atlama yapıyor. yani bi önce değerle yeni değer arasında gidip geliyor. :(

#009614

ebykdrms

952 gün önce

<select> elementinin onchange olayını tetikleterek çalıştırdığınız fonksiyonun içinde setInterval() fonksiyonu var. Her onchange olayıyla yeni bir setInterval() daha kuruyorsunuz. Yeni setInterval() fonksiyonunu çalıştırmadan önce, öncekini durdurmalısınız.

1) Mesela ilk satırda global bir değişken oluşturun:

var countdownInterval = null;

2) setInterval() fonksiyonunu oluştururken bu değişkene de atayın. Ayrıca sayımı başlatmadan önce, önceki sayımı temizleyin.

calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
if(countdownInterval) clearInterval(countdownInterval);
countdownInterval = setInterval(function() {
  calculateCountdown(todayImsakDate, todayAksamDate, tomorrowImsakDate, $countdown);
},1000);

#009613