Sepete Eklendiğinde Alert Uyarı Vermek

resat 749 gün önce

338 defa görüntülendi

Merhaba arkadaşlar, sepete ekle butonuna tıklayınca alert ile ekrana başarılı olarak uyarı verebiliyorum. Fakat yapmak istediğim sepete eklendiğinde sweetalert2 gibi bir modal açılması sepetine eklenmiştir diye. Nasıl yapabilirim acaba.

if(devam == 1){
  $.ajax({
    url: "post.php",
    type: "post",
    data: 'islem=urun-ekle&urun_id='+parseInt($(this).attr('data-sepete-ekle'))+'&adet='+parseInt($('[name="adet"]').val())+'&secenek_id='+secenek_id,
    success: function (x) {
      if(x == 0){
        $('#sepete_ekle_durum').addClass('hata').html('Yeterli stok bulunamadı.');
      }else if(x == 1){
        $('#sepete_ekle_durum').addClass('hata').html('Geçersiz istek.');
      }else{
        $('#sepete_ekle_durum').addClass('basari').html('<div class="alert alert-success mb-3">Ürün başarı ile sepete eklendi.</div>');
        sepet();
        $('#saydam_bg').fadeIn(500);
        $('#sepet').fadeIn(500);
        sepet_sayisi();
      }
    }
  });
}

<div class="add-to-cart-box">
  <input class="form-control input-number qty-input" type="hidden" min="1" max="10000000" name="adet" id="adet" value="1">
  <button class="btn btn-add-cart addcart-button" data-sepete-ekle="<?php echo $row['id']; ?>" id="spett">Sepete Ekle
    <span class="add-icon">
      <i class="fa-solid fa-cart-shopping"></i>
    </button>
  </div>

Soru hatalı mı? 👎

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

Spam olarak işaretle

Cevaplar (2)

h4ckdr0

748 gün önce

Merhaba,

Öncelikle SweetAlert2 kütüphanesini sayfanıza dahil etmeniz gerekiyor.
Bunun için aşağıdaki kodu sayfanızın <head> kısmına ekleyebilirsiniz:

<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>

Daha sonra, ajax isteğinizin başarılı olduğu durumda aşağıdaki gibi bir kod bloğu yazabilirsiniz:

if(x == 0){
  $('#sepete_ekle_durum').addClass('hata').html('Yeterli stok bulunamadı.');
}else if(x == 1){
  $('#sepete_ekle_durum').addClass('hata').html('Geçersiz istek.');
}else{
  // SweetAlert2 modalini ac
  Swal.fire({
    title: 'Ürün sepete eklendi!',
    text: 'Sepetinize ürün başarıyla eklendi.',
    icon: 'success',
    showConfirmButton: false,
    timer: 1500
  });

  // Sepeti guncelle
  sepet();
  $('#saydam_bg').fadeIn(500);
  $('#sepet').fadeIn(500);
  sepet_sayisi();
}

Bu kod bloğunda, SweetAlert2 kütüphanesini kullanarak bir modal açıyoruz ve başlık, metin, ikon ve timer ayarlarını yapıyoruz. Daha sonra sepeti güncelleyip modalı gösteriyoruz.

Daha fazla bilgi için SweetAlert2 dokümantasyonuna bakabilirsiniz: (https://sweetalert2.github.io)

İyi çalışmalar!

#011647

resat

748 gün önce

Teşekkürler @h4ckdr0

#011667