+1 oy
297 Görünüm
Ajax kategorisinde (123 puan) tarafından

Merhaba arkadaşlar. Kendimce bir proje geliştiriyorum ve bir noktada takıldım. Bu konuda bilgili arkadaşların fikirlerine başvurmak istedim. Bir ihale projesi için gerisayım sayacı kullanıyorum. Gerisayım ihalenin başlamasına ve bitmesine olmak üzere 2 kere geri sayıyor. İlk önce başlamasına şu kadar kaldı şeklinde sonrada bitmesine şu kadar kaldı gibi. Yapmak istediğim şey ihale başladığında veritabanımdaki "arac_durum" öğesini "Aktif" olarak, bittiğinde ise "Pasif" olarak güncellemek. Bana yardımcı olabilirmisiniz ?

Sizlerle kodlarımı paylaşıyorum;

Js kodu gerisayım;



function createCountDown(elementId, date, dateiki) {

    var countDownDate = new Date(date).getTime();

var x = setInterval(function() {


    var now = new Date().getTime();
    

    var distance = countDownDate - now;

    

    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    

    document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;
    
    //Burada "arac_durum" öğesinin "Aktif" olmasını istiyorum.
    
    
    

    if (distance < 0) {
        clearInterval(x);

        document.getElementById(elementId).innerHTML = "Başladı !";
        var bitistarihi = new Date(dateiki).getTime();
        var y = setInterval(function() {
            var simdi = new Date().getTime();
            var distance = bitistarihi - simdi;
            var days = Math.floor(distance / (1000 * 60 * 60 * 24));
            var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((distance % (1000 * 60)) / 1000);
            document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;
            if (distance < 0) {
                clearInterval(y);

                document.getElementById(elementId).innerHTML = "Bitti !";
                
                //Burada "arac_durum" öğesinin "Pasif" olmasını istiyorum.
                
                }
        }, 1000);
                
        
    }
}, 1000);

}

createCountDown("<?=$araccek['arac_id']?>", "<?=$araccek['arac_gerisayim']?>", "<?=$araccek['arac_tarih']?>")
  



 

Php kodum;

">

Database sütunları;

https://imgur.com/7ml9vRs

Paylaş

1 cevap

+1 oy
(3.3k puan) tarafından
tarafından seçilmiş
 
En İyi Cevap

Merhaba! Kodunuzda istediğiniz işlevi gerçekleştirmek için bazı adımlar eklemeniz gerekiyor. Gerisayım sayacı başladığında ve bittiğinde veritabanındaki arac_durum öğesini güncellemek için PHP ve JavaScript birlikte çalışacak şekilde biraz düzenleme yapmalıyız.

Temelde yapmanız gerekenler:

  1. İhale başladığında ve bittiğinde arac_durum'u güncellemek için bir backend (PHP) işlevi çağırmak.
  2. PHP tarafında veritabanı güncellemesi yapacak bir fonksiyon oluşturmak.
  3. JavaScript'ten PHP'ye AJAX ile veri göndermek.

Adım 1: PHP Veritabanı Güncelleme Fonksiyonu

Öncelikle, arac_durum öğesini güncellemek için bir PHP fonksiyonu oluşturmalısınız. Bu fonksiyon, AJAX ile çağrılacak ve veritabanında güncelleme yapacak.

PHP Kodu:
`php
<?php
// Veritabanı bağlantısını yapın
$servername = "localhost";
$username = "kullanıcı_adı";
$password = "şifre";
$dbname = "veritabani_adi";

$conn = new mysqli($servername, $username, $password, $dbname);

if ($conn->connect_error) {

die("Bağlantı başarısız: " . $conn->connect_error);

}

// AJAX ile gelen durumu alalım
if (isset($_POST['id']) && isset($_POST['durum'])) {

$id = $_POST['id'];
$durum = $_POST['durum'];

// arac_durum'u güncelleyen SQL sorgusu
$sql = "UPDATE araclar SET arac_durum = ? WHERE arac_id = ?";
$stmt = $conn->prepare($sql);
$stmt->bind_param("si", $durum, $id);  // "si" -> string, integer
$stmt->execute();

if ($stmt->affected_rows > 0) {
    echo "Durum başarıyla güncellendi.";
} else {
    echo "Bir hata oluştu.";
}

$stmt->close();

}

$conn->close();
?>
`

Bu PHP kodu, arac_id ve arac_durum parametrelerini alacak ve veritabanındaki ilgili kaydı güncelleyecektir. Şimdi JavaScript'ten bu fonksiyonu nasıl çağıracağımıza bakalım.

Adım 2: JavaScript ile AJAX Çağrısı

Gerisayım başladığında ve bittiğinde PHP'ye AJAX ile veri göndereceğiz. Bu sayede veritabanını güncelleyebileceğiz.

JavaScript Kodu:
`javascript
function updateStatus(id, durum) {

var xhr = new XMLHttpRequest();
xhr.open("POST", "guncelle_durum.php", true);  // PHP dosyasının yolu
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 && xhr.status == 200) {
        console.log(xhr.responseText);  // Güncellenen durumu kontrol et
    }
};
xhr.send("id=" + id + "&durum=" + durum);  // AJAX ile id ve durum gönder

}

function createCountDown(elementId, date, dateiki, aracId) {

var countDownDate = new Date(date).getTime();

var x = setInterval(function() {

    var now = new Date().getTime();
    var distance = countDownDate - now;

    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;

    if (distance < 0) {
        clearInterval(x);

        document.getElementById(elementId).innerHTML = "Başladı !";
        // Başladığında "Aktif" yap
        updateStatus(aracId, "Aktif");

        var bitistarihi = new Date(dateiki).getTime();
        var y = setInterval(function() {
            var simdi = new Date().getTime();
            var distance = bitistarihi - simdi;
            var days = Math.floor(distance / (1000 * 60 * 60 * 24));
            var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.floor((distance % (1000 * 60)) / 1000);
            document.getElementById(elementId).innerHTML = "Süre ►" + days + ": " + hours + ": " + minutes + ": " + seconds;

            if (distance < 0) {
                clearInterval(y);
                document.getElementById(elementId).innerHTML = "Bitti !";
                // Bittiğinde "Pasif" yap
                updateStatus(aracId, "Pasif");
            }
        }, 1000);

    }
}, 1000);

}

createCountDown("<?=$araccek['arac_id']?>", "<?=$araccek['arac_gerisayim']?>", "<?=$araccek['arac_tarih']?>", "<?=$araccek['arac_id']?>");
`

Adım 3: PHP Dosyasını Oluşturma

Yukarıdaki JavaScript'teki updateStatus fonksiyonu, guncelle_durum.php adlı bir PHP dosyasına AJAX ile veri gönderiyor. Bu dosya, veritabanını güncelleyen PHP kodunu içerecek.

guncelle_durum.php (Bu dosya yukarıdaki PHP kodunu içeriyor):
`php
<?php
// Veritabanı bağlantısı ve güncelleme işlemi burada
?>
`

Sonuç

Bu kodları birleştirerek, gerisayım başladığında arac_durum veritabanında Aktif olarak güncellenirken, bitiş zamanı geldiğinde Pasif olarak güncellenecektir. updateStatus fonksiyonu, ilgili PHP dosyasına AJAX isteği göndererek durumu günceller.

Her şeyin düzgün çalışabilmesi için JavaScript, PHP ve veritabanı bağlantılarınızın doğru olduğundan emin olun.

Bu Hafta En Aktif Üyeler
    ...