Membuat Jendela Konfirmasi Menghapus Data di Database
Munculnya kotak / jendela konfirmasi ketika meng-klik tombol delete. Contohnya, ketika tombol delete di klik, maka muncul dialog box yang bertuliskan "Are you sure you want to delete this data?". Jika diklik OK maka data akan dihapus, dan jika diklik Cancel maka tidak jadi dihapus. Seperti itulah maksudnya. Berikut contoh screenshotnya:
Sebenarnya caranya sangat mudah. Tinggal tambahkan javascript di bawah ini dalam tag <a>
Anda bisa mengganti kalimat Apakah anda yakin akan menghapus data ini? dengan kalimat lain.
Pertama buat database. Disini saya membuat database dengan namaexample. Selanjutnya buat tabel. Saya buat dengan nama contoh.
Setelah pembuatan tabel, isi tabel tersebut dengan sembarang data. Selanjutnya buat file php yang mengkoneksikan ke database. Simpan saja file tersebut dengan nama koneksi.php. Berikut script-nya:
Kemudian buat file php yang menampilkan data dari database. Saya beri nama file tersebut dengantampil.php. Berikut script-nya:
Nah, jika file tersebut sudah dibuat, coba buka di browser apakah data-nya bisa ditampilkan atau tidak. Jika data sudah bisa ditampilkan, maka kira-kira tampilannya seperti ini:
Pada kolom paling kanan, terdapat link dengan tulisan "Hapus". Seperti terlihat pada script, link tersebut mengarah ke aksi.php. Berikut ini adalah isi dari file aksi.php:
File aksi.php tersebut berfungsi menghapus data yang ada di database.
http://www.tulisanfaris.com/2012/12/membuat-jendela-konfirmasi-ketika.html
Sebenarnya caranya sangat mudah. Tinggal tambahkan javascript di bawah ini dalam tag <a>
- onclick="return confirm('Apakah anda yakin akan menghapus data ini?')"
Pertama buat database. Disini saya membuat database dengan namaexample. Selanjutnya buat tabel. Saya buat dengan nama contoh.
- create table contoh (
- id int(10) not null auto_increment,
- field1 varchar(50) not null,
- field2 varchar(50) not null,
- primary key(id)
- );
Setelah pembuatan tabel, isi tabel tersebut dengan sembarang data. Selanjutnya buat file php yang mengkoneksikan ke database. Simpan saja file tersebut dengan nama koneksi.php. Berikut script-nya:
- <?php
- $host = "localhost";
- $username = "root";
- $password = "";
- $database = "example";
- $connect = mysql_connect($host,$username,$password);
- mysql_select_db($database,$connect);
- ?>
Kemudian buat file php yang menampilkan data dari database. Saya beri nama file tersebut dengantampil.php. Berikut script-nya:
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Tampilan data</title>
- </head>
- <body>
- <center>
- <?php
- include("koneksi.php");
- $no = 1;
- $sql="SELECT * FROM contoh";
- $hasil=mysql_query($sql);
- echo "<table border='1'><tr><th style='padding:5px;'>No.</th><th>Field1</th><th>Field2</th><th>Aksi</th></tr>";
- if($hasil){
- while($baris=mysql_fetch_array($hasil)){
- echo"<tr><td style='padding:5px;'>".$no.".</td><td>".$baris['field1']."</td><td>".$baris['field2']."</td>";?>
- <td><a href="<?php echo "aksi.php?id=$baris[id]";?>" onclick="return confirm('Apakah anda yakin akan menghapus data ini?')">Hapus</a></td>
- <?php $no++;}
- echo "</tr></table>";
- }
- else {
- echo "gagal menampilkan data";
- }
- ?>
- </center>
- </body>
- </html>
Nah, jika file tersebut sudah dibuat, coba buka di browser apakah data-nya bisa ditampilkan atau tidak. Jika data sudah bisa ditampilkan, maka kira-kira tampilannya seperti ini:
Pada kolom paling kanan, terdapat link dengan tulisan "Hapus". Seperti terlihat pada script, link tersebut mengarah ke aksi.php. Berikut ini adalah isi dari file aksi.php:
- <?php
- include "koneksi.php";
- $id = $_GET['id'];
- $query = "DELETE from contoh WHERE id='$id'";
- mysql_query($query);
- header("location:tampil.php");
- ?>
File aksi.php tersebut berfungsi menghapus data yang ada di database.
http://www.tulisanfaris.com/2012/12/membuat-jendela-konfirmasi-ketika.html
Comments
Post a Comment