Cara Membuat Multiple Delete dengan Checkbox menggunakan PHP
Rizaldi Maulidia Achmad
Apa sebenarnya keuntungan dari fitur “Multiple Delete”? keuntungan dengan menyediakan fitur ini yakni agar memudahkan user yang menggunakan aplikasi kita untuk menghapus lebih dari 1 data dalam sekali aksi artinya fitur ini akan sangat berguna ketika user akan menghapus banyak data. Akan cukup merepotkan juga ketika dalam aplikasi hanya disediakan fitur hapus per 1 data, sementara user diharuskan menghapus banyak data. Untuk catatan kali ini, saya akan berbagi kepada Anda semua tentang bagaimana membuat fitur tersebut dengan menggunakan PHP dan MySQL.
DEMO
Sebelum masuk ke tutorialnya. Mungkin ada yang mau lihat demonya terlebih dahulu. Silahkan klik link berikut untuk melihat demonya : Lihat Demo.
STEP 1 – PERSIAPAN
Berikut ini adalah hal-hal yang harus dipersiapkan :
- Download JQUERY, klik link berikut : Download.
- Buat sebuah folder baru dengan nama multiple_delete, lalu simpan pada folder xampp/htdocs/.
- Buat sebuah folder dengan nama js, lalu simpan pada folder xampp/htdocs/search_ajax/.
- Rename file JQUERY yang telah di download tadi menjadi jquery.min.js, lalu copy and paste pada folder xampp/htdocs/multiple_delete/js/.
STEP 2 – DATABASE
Pada step ini, kita akan membuat databasenya. ikuti langkah-langkah berikut ini :
- Buat sebuah database dengan nama mynotescode.
- Buat sebuah tabel dengan nama siswa. Struktur tabelnya sebagai berikut :
CREATE TABLE IF NOT EXISTS `siswa` ( `nis` varchar(11) NOT NULL, `nama` varchar(50) NOT NULL, `jenis_kelamin` varchar(10) NOT NULL, `telp` varchar(15) NOT NULL, `alamat` text NOT NULL, PRIMARY KEY (`nis`) )
STEP 3 – KONEKSI DATABASE
Pada step ini, kita akan membuat file koneksi.php yang berfungsi untuk menghubungkan dengan database MySQL. Silahkan buat file koneksi.php, lalu simpan di folder xampp/htdocs/multiple_delete/. Berikut ini kodenya :
<?php
$host = 'localhost'; // Nama hostnya
$username = 'root'; // Username
$password = ''; // Password (Isi jika menggunakan password)
$database = 'mynotescode'; // Nama databasenya
// Koneksi ke MySQL dengan PDO
$pdo = new PDO('mysql:host='.$host.';dbname='.$database, $username, $password);
?>
STEP 4 – FORM
Langkah selanjutnya adalah membuat 1 buah file yang berisi sebuah form untuk melakukan proses hapus data. Buat sebuah file dengan nama index.php, lalu simpan pada folder xampp/htdocs/multiple_delete/. Berikut tampilan dan kodenya :
<html>
<head>
<title>Multiple Delete</title>
<!-- Load librari/plugin jquery nya -->
<script src="js/jquery.min.js"></script>
</head>
<body>
<h1>Multiple Delete</h1>
<form method="post" action="delete.php" id="form-delete">
<table border="1" cellpadding="5">
<tr>
<th><input type="checkbox" id="check-all"></th>
<th>NIS</th>
<th>Nama</th>
<th>Telepon</th>
<th>Alamat</th>
</tr>
<?php
// Load file koneksi.php
include "koneksi.php";
// Buat query untuk menampilkan semua data siswa
$sql = $pdo->prepare("SELECT * FROM siswa");
$sql->execute(); // Eksekusi querynya
$no = 1; // Untuk penomoran tabel, di awal set dengan 1
while($data = $sql->fetch()){ // Ambil semua data dari hasil eksekusi $sql
echo "<tr>";
echo "<td><input type='checkbox' class='check-item' name='nis[]' value='".$data['nis']."'></td>";
echo "<td>".$data['nis']."</td>";
echo "<td>".$data['nama']."</td>";
echo "<td>".$data['telp']."</td>";
echo "<td>".$data['alamat']."</td>";
echo "</tr>";
$no++; // Tambah 1 setiap kali looping
}
?>
</table>
<hr>
<button type="button" id="btn-delete">DELETE</button>
</form>
<script>
$(document).ready(function(){ // Ketika halaman sudah siap (sudah selesai di load)
$("#check-all").click(function(){ // Ketika user men-cek checkbox all
if($(this).is(":checked")) // Jika checkbox all diceklis
$(".check-item").prop("checked", true); // ceklis semua checkbox siswa dengan class "check-item"
else // Jika checkbox all tidak diceklis
$(".check-item").prop("checked", false); // un-ceklis semua checkbox siswa dengan class "check-item"
});
$("#btn-delete").click(function(){ // Ketika user mengklik tombol delete
var confirm = window.confirm("Apakah Anda yakin ingin menghapus data-data ini?"); // Buat sebuah alert konfirmasi
if(confirm) // Jika user mengklik tombol "Ok"
$("#form-delete").submit(); // Submit form
});
});
</script>
</body>
</html>
Untuk fitur multiple delete yang akan kita buat ini, konsepnya adalah dengan memanfaatkan checkbox. Checkbox ini berguna untuk agar user bisa memilih data mana saja yang akan dia hapus. Jadi kita akan melakukan hapus data terhadap data siswa yang user ceklis saja.
echo “<td><input type=’checkbox’ class=’check-item’ name=’nis[]‘ value='”.$data[‘nis’].”‘></td>”;
Kunci utama dari multiple delete ini adalah atribut name pada checkbox siswa nya. Pada kode diatas, terlihat saya memberi atribut checkbox nya dengan “nis[]” dan diisi dengan value dari nis siswa tersebut. Arti dari kurung siku disitu adalah agar ketika kita kirim data nis tadi ke file proses hapus melalui form submit, data nis tersebut menjadi sebuah array yang berisi nis siswa yang telah di pilih oleh user. Kalau kita coba lihat isi dari data nis tersebut, hasilnya akan seperti gambar dibawah ini :
Gambar diatas merupakan hasil dari kode print_r($_POST); pada file proses hapus (akan kita buat pada step selanjutnya). Untuk melihat data apa saja yang dikirim dari form. Terlihat bahwa terdapat data nis yang berisi nis-nis yang berjumlah 5 nis (karena di form saya ceklis 5 siswa).
STEP 5 – PROSES HAPUS
Selanjutnya akan membuat proses hapusnya. Buat sebuah file dengan nama delete.php, lalu simpan pada folder xampp/htdocs/multiple_delete/. Berikut ini kodenya :
<?php
// Load file koneksi.php
include "koneksi.php";
$nis = $_POST['nis']; // Ambil data NIS yang dikirim oleh index.php melalui form submit
$query = "DELETE FROM siswa WHERE nis IN('".implode(",", $nis)."')"; // Buat variabel $query untuk menampung query delete
$sql = $pdo->prepare($query);
$sql->execute(); // Eksekusi/Jalankan query dari variabel $query
header("location: index.php"); // Redirect ke halaman index.php
?>
Pada proses hapus disini, kita akan coba menyatukan data nis (berupa array) menjadi sebuah string dengan tanda pemisah koma “,”. Caranya yakni dengan menggunakan fungsi implode() di php. Struktur dasara fungsi implode adalah :
implode ( string $glue , array $pieces )
Jadi parameter pertama diisi dengan string pemisah nya apa. Parameter kedua diisi dengan array yang akan kita satukan dengan pemisah yang ditentukan di parameter pertama. Gambar berikut ini menunjukan array data nis dan hasil dari fungsi implode yang di lakukan terhadap array data nis tadi :
Gambar 1 : Array Data NIS
Gambar 2 : Hasil Implode terhadap array data NIS
Dapat Anda lihat dari kedua gambar diatas, hasil dari fungsi implode berisi data nis dengan pemisah koma antar nis nya. Setelah mendapatkan data nis dengan pemisah koma, kita akan lakkukan query delete dengan where clause “IN”. Contoh :
DELETE FROM siswa WHERE nis IN (10110470116,10110470118,10110470119,10110470121,10110470122)
Nanti otomatis mysql akan menghapus data siswa dengan nis yang ada pada tanda kurung ().
Sekian untuk catatan kali ini. Semoga catatan ini bisa bermanfaat. Apabila ada yang ingin ditanyakan, langsung tanyakan saja lewat form komentar dibawah ini. Jangan lupa LIKE & SHARE nya hehe. Terimakasih.
SOURCE CODE
Untuk mengunduh source code nya, klik salah satu link dibawah ini
– Download versi PDO : Link download yang sesuai tutorial ini yakni menggunakan fungsi PDO untuk query ke databasenya
– Download versi MySQLi : Link download untuk Anda yang ingin source code versi MySQLi dari tutorial ini
SUMBER & REFERENSI
http://php.net/manual/en/language.types.array.php
http://php.net/manual/en/book.pdo.php
Tutorial membuat multiple delete dengan checkbox menggunakan php dan mysql, Tutorial membuat multiple delete data dengan checkbox menggunakan php jquery dan mysql, cara mudah membuat multiple delete dengan checkbox menggunakan php dan mysql. Source code multiple delete dengan checkbox menggunakan php dan mysqli.
POST YOUR COMMENTS