Cara Membuat Multiple Delete dengan Checkbox pada PHP

Cara Membuat Multiple Delete dengan Checkbox Menggunakan PHP – Hai sobat ketemu lagi dengan saya dewan komputer dan pada kesempatan kali ini saya akan memposting tentang cara membuat hapus data menggunakan ajax dan bisa menghapus dua atau lebih data sekaligus dengan checkbox. Terkadang kita perlu membuat sebuah aplikasi yang memudahkan user dalam menggunakannya, salah satunya yang akan dibahas disini yaitu dalam menghapus data. Jika ada banyak data dan dalam aplikasi kita tidak ada multiple delete tentu akan merepotkan pengguna karena harus menghapus satu per satu datanya. Dengan cara yang akan dicontohkan pada postingan ini tentu akan mempersingkat waktu dan membuat pekerjaan menjadi efisien.

Selain itu nanti akan kita buat juga check all sehingga user tidak perlu kali mencentang satu per satu jika ingin menghapus semua data. Caranya sangat mudah, sobat tinggal mengikuti langkah-langkah dibawah :

Membuat Database MySQL

1. Pertama yang WAJIB ada yaitu sobat harus membuat sebuah database. Sobat bisa menggunakan tools bantu seperti navicat, heidi SQL atau lainnya. Sobat juga bisa membuatnya dengan mengakses url localhost/phpmyadmin -> klik tab Database dan tuliskan db_dewankomputer-> Klik tombol Create/Buat.

2. Buat tabel untuk mengetesnya dengan mengetikkan query dibawah ini pada tab SQL lalu klik tombol Kirim/Go

CREATE TABLE `tbl_karyawan`  (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `nama_lengkap` varchar(50) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,
  `alamat` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,
  `jenkel` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,
  `jabatan` varchar(100) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,
  `umur` int(11) NOT NULL,
  `foto` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,
  PRIMARY KEY (`id`) USING BTREE
)

CREATE TABLE `tbl_karyawan` (

`id` int(11) NOT NULL AUTO_INCREMENT,

`nama_lengkap` varchar(50) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,

`alamat` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,

`jenkel` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,

`jabatan` varchar(100) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL,

`umur` int(11) NOT NULL,

`foto` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL,

PRIMARY KEY (`id`) USING BTREE

)

3. Untuk mencobanya agar sobat tidak memasukkan satu persatu maka sobat eksekusi saja query sql dibawah ini

INSERT INTO `tbl_karyawan` VALUES (1, 'Jono Jondah', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Supir', 36, 'avatar1.png');
INSERT INTO `tbl_karyawan` VALUES (2, 'Tini Skak', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Programmer', 24, 'avatar3.png');
INSERT INTO `tbl_karyawan` VALUES (3, 'Jini oh jini', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Service technician', 262, 'avatar3.png');
INSERT INTO `tbl_karyawan` VALUES (4, 'Slamet', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Office Boy', 32, 'avatar1.png');
INSERT INTO `tbl_karyawan` VALUES (5, 'Sule Rharjo', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Akuntan', 29, 'avatar2.png');
INSERT INTO `tbl_karyawan` VALUES (6, 'Cristiano Ronaldinho', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Systems programmer', 32, 'avatar2.png');
INSERT INTO `tbl_karyawan` VALUES (7, 'Angelina Ozawa', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Sekertaris', 38, 'avatar3.png');
INSERT INTO `tbl_karyawan` VALUES (8, 'Titin', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Konsultan', 2823, 'avatar3.png');
INSERT INTO `tbl_karyawan` VALUES (9, 'Pongki', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Analis', 6413, 'avatar2.png');
INSERT INTO `tbl_karyawan` VALUES (10, 'Budun', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Fotografer', 331, 'avatar1.png');

INSERT INTO `tbl_karyawan` VALUES (1, 'Jono Jondah', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Supir', 36, 'avatar1.png');

INSERT INTO `tbl_karyawan` VALUES (2, 'Tini Skak', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Programmer', 24, 'avatar3.png');

INSERT INTO `tbl_karyawan` VALUES (3, 'Jini oh jini', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Service technician', 262, 'avatar3.png');

INSERT INTO `tbl_karyawan` VALUES (4, 'Slamet', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Office Boy', 32, 'avatar1.png');

INSERT INTO `tbl_karyawan` VALUES (5, 'Sule Rharjo', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Akuntan', 29, 'avatar2.png');

INSERT INTO `tbl_karyawan` VALUES (6, 'Cristiano Ronaldinho', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Systems programmer', 32, 'avatar2.png');

INSERT INTO `tbl_karyawan` VALUES (7, 'Angelina Ozawa', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Sekertaris', 38, 'avatar3.png');

INSERT INTO `tbl_karyawan` VALUES (8, 'Titin', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Perempuan', 'Konsultan', 2823, 'avatar3.png');

INSERT INTO `tbl_karyawan` VALUES (9, 'Pongki', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Analis', 6413, 'avatar2.png');

INSERT INTO `tbl_karyawan` VALUES (10, 'Budun', 'Jalan Rajawali Cilacap Selatan Jawa Tengah', 'Laki-laki', 'Fotografer', 331, 'avatar1.png');

Cara Membuat Multiple Delete

1.Buat file koneksi.php yang berfugsi untuk menyambungkan aplikasi dengan database dan isikan dengan kode dibawah

<?php
define('HOST','localhost');
define('USER','root');
define('PASS','');
define('DB1', 'db_dewankomputer');

// Buat Koneksinya
$db1 = new mysqli(HOST, USER, PASS, DB1);
?>

<?php

define('HOST','localhost');

define('USER','root');

define('PASS','');

define('DB1', 'db_dewankomputer');

// Buat Koneksinya

$db1 = new mysqli(HOST, USER, PASS, DB1);

isikan sesuai dengan host, user, password, dan nama database sobat. Untuk contoh di bawah ini saya berinama database dengan nama db_dewankomputer.

Jika sobat ingin tahu cara mengkoneksikan dengan dua database atau lebih dalam satu aplikasi maka sobat bisa kunjungi postingan dibawah ini

Cara Membuat Koneksi dengan Database MySQL bisa Dua atau Lebih Koneksi database/Multiple Connection dalam Satu Host maupun beda Host

2. Buat file index.php isikan seperti dibawah ini

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  <link rel="icon" href="dk.png">
  <title>Delete Multiple Data - www.dewankomputer.com</title>
  <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.css" rel="stylesheet">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
  <nav class="navbar navbar-dark bg-primary">
    <a class="navbar-brand text-white" href="index.php">
      Dewan Komputer
    </a>
  </nav>

  <div class="container">
    <h3 align="center" class="mt-3">Menghapus Multiple Data dengan Checkbox pada PHP</h3>
      <?php
        include 'koneksi.php';
        $query = "SELECT * FROM tbl_karyawan";
        $dewan1 = $db1->prepare($query);
        $dewan1->execute();
        $res1 = $dewan1->get_result();

        if($res1->num_rows > 0){
      ?>
      <form action="delete.php" method="POST">
        <div align="right">
          <button type="submit" name="btn_delete" id="btn_delete" class="btn btn-danger mb-4 mt-4" onclick="javascript: return confirm('Apakah Anda yakin ingin menghapus data ini?')">Delete Selected</button>
        </div>

        <div class="table-responsive">
          <table class="table table-striped table-bordered">
            <thead>
              <tr>
                <th>No</th>
                <th>Nama Lengkap</th>
                <th>Jenis Kelamin</th>
                <th>Alamat</th>
                <th><input type="checkbox" class="form-control check_all"/></th>
              </tr>
            </thead>
            <tbody>           
              <?php
                $no=1;
                while($row = $res1->fetch_assoc()){
              ?>
                <tr id="<?php echo $row["id"]; ?>">
                  <td><?php echo $no++; ?></td>
                  <td><?php echo $row["nama_lengkap"]; ?></td>
                  <td><?php echo $row["jenkel"]; ?></td>
                  <td><?php echo $row["alamat"]; ?></td>
                  <td>
                    <input type="checkbox" name="id[]" class="form-control chk_boxes1" value="<?php echo $row["id"]; ?>" />
                  </td>
                </tr>
              <?php } ?>
            </tbody>
          </table>
        </div>

        </form>
      <?php } ?>
  </div>

  <div class="text-center p-2">© <?php echo date('Y'); ?> Copyright:
    <a href="https://dewankomputer.com/"> Dewan Komputer</a>
  </div>

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script type="text/javascript">
    $(function() {
      $('.check_all').click(function() {
          $('.chk_boxes1').prop('checked', this.checked);
      });
    });
  </script>
</body>
</html>

<!DOCTYPE html>

<html>

<head>

<title>Delete Multiple Data - www.dewankomputer.com</title>

</head>

<body>

Dewan Komputer

</a>

</nav>

<h3 align="center" class="mt-3">Menghapus Multiple Data dengan Checkbox pada PHP</h3>

<?php

include 'koneksi.php';

$query = "SELECT * FROM tbl_karyawan";

$dewan1 = $db1->prepare($query);

$dewan1->execute();

$res1 = $dewan1->get_result();

if($res1->num_rows > 0){

<button type="submit" name="btn_delete" id="btn_delete" class="btn btn-danger mb-4 mt-4" onclick="javascript: return confirm('Apakah Anda yakin ingin menghapus data ini?')">Delete Selected</button>

</div>

<thead>

<tr>

<th>Nama Lengkap</th>

<th>Jenis Kelamin</th>

<th>Alamat</th>

</tr>

</thead>

<tbody>

<?php

$no=1;

while($row = $res1->fetch_assoc()){

<td>

</td>

</tr>

<?php } ?>

</tbody>

</table>

</div>

</form>

<?php } ?>

</div>

<a href="https://dewankomputer.com/"> Dewan Komputer</a>

</div>

$(function() {

$('.check_all').click(function() {

$('.chk_boxes1').prop('checked', this.checked);

});

</script>

</body>

</html>

Penjelasan :

Pada bagian paling bawah di kode berikut berfungsi saat user klik checkbox pada header tabel atau checkbox paling atas, maka semua checkbox akan tercentang otomatis. Checkbox ini biasa disebut check all.

<script type="text/javascript">
  $(function() {
    $('.check_all').click(function() {
        $('.chk_boxes1').prop('checked', this.checked);
    });
  });
</script>

$(function() {

$('.check_all').click(function() {

$('.chk_boxes1').prop('checked', this.checked);

});

</script>

3. Seperti yang terlihat pada file index.php pada form action menuju ke file delete.php. Oleh karena itu sobat perlu membuatnya terlebih dahulu file delete.php kemudian isikan dengan script dibawah ini

<?php
include 'koneksi.php';
	if(isset($_POST["id"])){
		foreach($_POST["id"] as $id){
			$query = "DELETE FROM tbl_karyawan WHERE id=?";
			$dewan1 = $db1->prepare($query);
			$dewan1->bind_param("i", $id);
			$dewan1->execute();
		}
	}

	echo "<script>location='index.php';</script>";
?>

<?php

include 'koneksi.php';

if(isset($_POST["id"])){

foreach($_POST["id"] as $id){

$query = "DELETE FROM tbl_karyawan WHERE id=?";

$dewan1 = $db1->prepare($query);

$dewan1->bind_param("i", $id);

$dewan1->execute();

}

echo "<script>location='index.php';</script>";

4. Kemudian jalankan project sobat maka akan muncul tampilan seperti dibawah ini

Jika berhasil maka saat sobat klik checkbox paling atas maka semua akan tercentang dan jika klik tombol Delete maka akan menghapus data yang tercentang.

Bagaimana mudah bukan? tentu ini adalah cara yang paling standar. Jika sobat ingin menggunakan cara yang cukup sulit juga bisa yaitu menggunakan Ajax. karena menggunakan Ajax tentunya bisa tanpa loading atau refresh page. Itu tantu akan saya bahas pada postingan saya selanjutnya supaya sobat tidak bingung.

Sekian postingan saya tentang Cara Membuat Multiple Delete dengan Checkbox pada PHP. Jika ada salah kata saya mohon maaf dan jika ada pertanyaan silahkan tinggalkan pada kolom komentar dibawah.

Jika sobat ingin mendownload tutorial diatas maka sobat bisa klik link dibawah ini :

Sampai jumpa pada postingan saya selanjutnya..