Butona Tıklayınca Ekrana Uyarı Verme (SweetAlert)

Yazımızı okuduğunuz için teşekkürler

Bugünkü konumuzda birçok otomasyonda ve web sitelerinde kullanılan popup şeklinde ekrana çıkan uyarı ekranlarını yani sweetAlertleri göreceğiz SweetAlert nedir ? nasıl kullanılır ? gibi konulara değineceğiz.

Bunun için SweetAlert2 kütüphanesini kullanacağız.

Öncelikle bir form oluşturalım . Ben bir önceki derste (Pdo ile Veritabanına Veri Kaydetme) hazır olan formu kullacağım.

Şimdi SweetAlert sitesine gidelim ve uzak sunucu kodlarını head tagları arasına ekleyelim. Aşağıdaki fotografta kodu alacağınız kısmı işaretledim.



CDN’nin altındaki işaretli kodu kopyalayıp head tagının arasına atıyoruz

<?php include "vt.php" ?>
<!DOCTYPE html>
<html>
<head>
	<title>VeriTabanı Kayıt İşlemi</title>
	<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

	<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<?php /* Sweetalert uzak sunucu bağlantı kodu */ ?>
<script src="https://unpkg.com/sweetalert/dist/sweetalert.min.js"></script>
</head>
<body>
	<form method="post">
		<input type="text" name="ad" placeholder="adınızı giriniz"><br>
		<br>
		<input type="text" name="soyad" placeholder="soyadınızı giriniz"><br>
		<br>
		<input type="submit" name="gonder">
        
	</form>


</body>
</html>

<?php

if (isset($_POST['ad'], $_POST['soyad'])) {

    $ad = trim(filter_input(INPUT_POST, 'ad', FILTER_SANITIZE_STRING));
    $soyad = trim(filter_input(INPUT_POST, 'soyad', FILTER_SANITIZE_STRING));
    $eposta = trim(filter_input(INPUT_POST, 'eposta', FILTER_SANITIZE_EMAIL));

    if (empty($ad) || empty($soyad)) {
        die("<p>Lütfen formu eksiksiz doldurun!</p>");
    }

   

   
}

?>

<?php
if (isset($_POST['ad'], $_POST['soyad'])) {

    $ad = trim(filter_input(INPUT_POST, 'ad', FILTER_SANITIZE_STRING));
    $soyad = trim(filter_input(INPUT_POST, 'soyad', FILTER_SANITIZE_STRING));
    

    if (empty($ad) || empty($soyad)) {
        die("<p>Lütfen formu eksiksiz doldurun!</p>");
    }


    try {

        $baglanti = new PDO("mysql:host=localhost;dbname=ders", "root", "");
        $baglanti->exec("SET NAMES utf8");
        $baglanti->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        $sorgu = $baglanti->prepare("INSERT INTO ders(ad, soyad) VALUES(?, ?)");
        $sorgu->bindParam(1, $ad, PDO::PARAM_STR);
        $sorgu->bindParam(2, $soyad, PDO::PARAM_STR);

        $sorgu->execute();
$var =$_POST['gonder'];

  
    } catch (PDOException $e) {
        die($e->getMessage());
    }

    $baglanti = null;
}

?>	
<?php 
/* Button'a tıklayınca uyarı çıkması için burada bir koşul oluşturuyoruz. */
?>
<?php 

if(isset($_POST['gonder'])){

     echo '<script>swal("Başarılı","Güncellendi","success").then((value)=>{ window.location.href = "sweetalert.php"});

            </script>';

}

 ?>

Yukarıda oluşturduğumuz koşulda diyoriz ki eğer name parametresi gondere eşit olan button’a tıklandıysa yani button bir değere sahip olunca bizim sweetalert ile oluşturuğumuz uyarı ekranı gelecektir.

Bir Sonraki Yazımızda Görüşmek üzere .

Not: Kullandığım formda veritabanı bağlantısı olduğu için vt.php dosyası sizde olmazsa hata alırsınız bir önceki konudan edinebilirsiniz.

İlk yorum yapan olun

Bir yanıt bırakın

E-posta hesabınız yayımlanmayacak.


*