Cara Membuat Notifikasi Edit dan Delete Data di PHP dengan Sweet Alert

Assalmualaikum Warahmatullahi Wabarakatu
Bismillahirrahmanirrahiim

Alert adalah notifikasi javascript yang sering kita gunakan dalam memvalidasi suatu script atau kode yang kita jalankan, alert default javascript adalah seperti code dibawah ini

<a href ="#" onclick="return confirm('Hapus Data?');">Delete</a>

Hasilnya seperti gambar dibawah ini

Disini saya akan membahas bagaimana caranya untuk membuat alert edit dan delete data dengan sweet alert agar mendapatkan tampilan seperti gambar dibawah ini :

Oke sobat langsung saja …..

Langkah pertama
Download sweet alert disini dan jquery disini

Langkah kedua
Extract hasil download ke folder root server local sobat, kalau saya di c:\xampp\htdocsc\php7\sweetalert, sesuaikan dengan folder root server local sobat.

Langkah ketiga
Buatlah database baru dengan nama alert atau sesuai dengan yang sobat inginkan, kemudian buatlah tabel dengan nama subscribe

CREATE TABLE `alert` (
  `alert_id` int(11) NOT NULL AUTO_INCREMENT,
  `alert_name` varchar(255) DEFAULT NULL,
  `description` varchar(255) DEFAULT NULL,
  `date` timestamp NULL DEFAULT NULL ON UPDATE CURRENT_TIMESTAMP,
  PRIMARY KEY (`alert_id`)
) ENGINE=InnoDB AUTO_INCREMENT=2 DEFAULT CHARSET=latin1;

Langkah Keempat
Ketiklah kode sweet alert dibawah ini, code dibawah merupakan kode untuk menampung email subscribe dengan php. Simpan dengan nama index.php

<!DOCTYPE HTML>
<html lang="en"> 
<head>
<meta charset="utf-8">
<title>Aguzrybudy.com | Sweet Alert</title>
<link rel="stylesheet" href="alert/css/sweetalert.css">
</head>
<body >

<table id="mytable" class="table table-bordered" border="1"><thead>       <th>No</th>       <th>Name</th>       <th>Description</th>       <th>Action</th>     </thead> <?php 
$host="localhost";
$user="root";
$pass="";
$database="dbphp7";
$koneksi=new mysqli($host,$user,$pass,$database);
if (mysqli_connect_errno()) {
   trigger_error('Koneksi ke database gagal: '  . mysqli_connect_error(), E_USER_ERROR); 
}
$no = 0;
$modal=mysqli_query($koneksi,"SELECT * FROM alert");
while($r=mysqli_fetch_array($modal)){
$no++;
       
?>
<tr>       <td><?php echo $no; ?></td>       <td><?php echo  $r['alert_name']; ?></td>       <td><?php echo  $r['description']; ?></td>       <td>
<a href="proses_delete.php?&alert_id=<?php echo  $r['alert_id']; ?>"  class="edit-link">Edit</a>
<a href="proses_delete.php?&alert_id=<?php echo  $r['alert_id']; ?>"  class="delete-link">Delete</a>

</td>   </tr>
<?php } ?> </table>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script src="alert/js/sweetalert.min.js"></script>
<script src="alert/js/qunit-1.18.0.js"></script>


 <script>
        jQuery(document).ready(function($){
            $('.delete-link').on('click',function(){
                var getLink = $(this).attr('href');
                swal({
                        title: 'Alert',
                        text: 'Hapus Data?',
                        html: true,
                        confirmButtonColor: '#d9534f',
                        showCancelButton: true,
                        },function(){
                        window.location.href = getLink
                    });
                return false;
            });
        });
    </script>

    <script>
        jQuery(document).ready(function($){
            $('.edit-link').on('click',function(){
               var getLink = $(this).attr('href');
                swal({
                        title: ' Alert',
                        text: 'Edit Data?',
                        html: true,
                        confirmButtonColor: '#d9534f',
                        showCancelButton: true,
                        },function(){
                        window.location.href = getLink
                    });
                return false;
            });
        });
    </script>
 
</body>
</html>

Selanjutnya ketik kode dibawah ini, simpan dengan nama proses_delete.php, untuk editnya sobat buat sendiri ya, konsepnya sama dengan proses delete data, kalau di edit data query delete di ganti menjadi select.

<?php
$host="localhost";
$user="root";
$pass="";
$database="dbphp7";
$koneksi=new mysqli($host,$user,$pass,$database);
if (mysqli_connect_errno()) {
   trigger_error('Koneksi ke database gagal: '  . mysqli_connect_error(), E_USER_ERROR); 
}
$modal_id=$_GET['alert_id'];
$modal=mysqli_query($koneksi,"Delete FROM alert WHERE alert_id='$modal_id'");
header('location:index.php');
?>

Jika sobat telah berhasil membuat script diatas ketika sobat klik link delete atau edit akan muncul tampilan seperti gambar dibawah ini .

Code diatas saya tulis menggunakan php 7.
sampai disini dulu tutorial dari saya , Semoga tutorial ini bermanfaat bagi sobat, atas segala kekuranganya mohon dimaafkan dan di beri saran untuk file PDF -NYA download disini dan jika sobat ingin code dari aplikasi diatas download disini.

Tags:

tips

Posted by: Aguzrybudy

Saya adalah seorang Software Engineer yang berfokus pada Web Development, App Development, Software Development, DevOps, dan Database Engineering. Saya memiliki minat besar pada dunia teknologi, pengembangan sistem, aplikasi digital, pengelolaan database, dan infrastruktur server. Saya terus belajar, mengembangkan keterampilan, serta membagikan wawasan seputar teknologi, pengembangan digital, dan inovasi modern.

Posting Komentar

20 Komentar

sarah lusi10 Juli 2016 pukul 23.31.00 WIB
passwordnya ap om?
BalasHapus
Balasan
Nugroho Lesmana6 November 2016 pukul 16.55.00 WIB
halo mas,
mau sedikit koreksi..

yang pada file proses_delete.php pada baris 11 apa ga kebalik yah?

$modal=mysqli_query($koneksi,"Delete FROM alert WHERE modal_id='$alert_id'");
seharus nya
$modal=mysqli_query($koneksi,"Delete FROM alert WHERE alert_id='$modal_id'");

tetap berkarya terus mas ..
salam hangat
BalasHapus
Balasan
Unknown17 Januari 2017 pukul 18.23.00 WIB
Hi, many thanks for your tutorial, is it possible to add a confirmation message when the action has been performed?
BalasHapus
Balasan
Unknown2 Maret 2017 pukul 01.02.00 WIB
Tutornya Mantap Gan Thanks ^^
BalasHapus
Balasan
Anonim5 Maret 2017 pukul 12.28.00 WIB
Password nya gak bisa dibuka?
BalasHapus
Balasan
IT Komputer8 April 2017 pukul 15.09.00 WIB
taufikroland.blogspot.com
BalasHapus
Balasan
Dhecode12 Juli 2017 pukul 21.21.00 WIB
class="delete-link"
bagaimana jika saya menggunakan class="btn btn-danger btn-sm" untuk linknya ?
BalasHapus
Balasan
Fikrie18 Oktober 2017 pukul 08.45.00 WIB
sweetalertnya tidak tampil kenapa ya?
saya malah langsung ke proses delete?
dan datanya langsung hilang saja
BalasHapus
Balasan
ALHUMAIDI12 Mei 2018 pukul 08.00.00 WIB
Terimakasih mas :)

Salam hangat Edy Tux
BalasHapus
Balasan
TEST12 Oktober 2018 pukul 15.11.00 WIB
hallo gan, untuk menambahkan :
swal("Berhasil!", "Data Berhasil Dihapus!", "success");

itu taro nya dimana ya gan ?
terima kasih
BalasHapus
Balasan
Unknown28 Maret 2019 pukul 06.35.00 WIB
password rar nya ga bisa mas
BalasHapus
Balasan
Anonim17 April 2022 pukul 14.43.00 WIB
Cara Membuat Notifikasi Edit Dan Delete Data Di Php Dengan Sweet Alert >>>>> Download Now

>>>>> Download Full

Cara Membuat Notifikasi Edit Dan Delete Data Di Php Dengan Sweet Alert >>>>> Download LINK

>>>>> Download Now

Cara Membuat Notifikasi Edit Dan Delete Data Di Php Dengan Sweet Alert >>>>> Download Full

>>>>> Download LINK Rp
BalasHapus
Balasan