بِسْمِ اللَّهِ Mudah-mudahan tutorial CRUD Bagian 3 (Hapus data) ini bermanfaat
Bagian terakhir yang juga tidak kalah penting dari CRUD (Create, Read, Update, dan Delete) adalah Delete atau hapus data.
Persiapan CRUD Bagian 2 (Hapus data)
Untuk melanjutkan tutorial pastikan sudah:
Mengerjakan CRUD Bagian 1 pada tutorial sebelumnya
Dan tentu saja sudah mengerjakan CRUD Bagian 2, karena sebagian sudah dikerjakan pada tutorial tersebut
Pertama
Update template dengan menambahkan script berikut ini pada file app\Views\template\index.php. Tambahkan sebelum <!– Logout Modal–>
<?= $this->renderSection('div-modal'); ?>
Kedua
Ubah file app\Views\news\index.php pada bagian <div class=”table-responsive”> dengan script ini. Tambahkan tombol untuk menghapus data pada daftar denga script berikut
<a href="#" class="btn btn-danger btn-circle btn-sm" data-id="<?= $row->id;?>">
<i class="fas fa-trash"></i>
</a>
Dan <div class=”table-responsive”> secara lengkap akan seperti ini:
<div class="table-responsive">
<table class="table table-bordered" id="dataTable" width="100%" cellspacing="0">
<thead>
<tr>
<th>ID</th>
<th>Judul</th>
<th>Slug</th>
<th>Tanggal</th>
<th style="width: 90px;"></th>
</tr>
</thead>
<tfoot>
<tr>
<th>ID</th>
<th>Judul</th>
<th>Slug</th>
<th>Tanggal</th>
<th style="width: 90px;"></th>
</tr>
</tfoot>
<tbody>
<?php foreach($news as $row): ?>
<tr>
<td><?= $row->id; ?></td>
<td><?= $row->title; ?></td>
<td><?= $row->slug; ?></td>
<td><?= $row->publish_date; ?></td>
<td>
<a href="<?= base_url('news/edit/' . $row->id); ?>" class="btn btn-warning btn-circle btn-sm">
<i class="fas fa-edit"></i>
</a>
<a href="#" class="btn btn-danger btn-circle btn-sm" data-id="<?= $row->id;?>">
<i class="fas fa-trash"></i>
</a>
</td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
Kemudian masih di file app\Views\news\index.php, tambahkan script berikut, untuk konfirmasi hapus data dan jquery tombol hapus
<?= $this->section('div-modal') ?>
<!-- Modal Delete News-->
<form action="<?= base_url(); ?>/news/delete" method="post">
<div class="modal fade" id="deleteModalNews" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Hapus Berita</h5>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<h4>Apakah Anda yakin menghapus data ini?</h4>
</div>
<div class="modal-footer">
<input type="hidden" name="id" class="id">
<button class="btn btn-secondary" type="button" data-dismiss="modal">Tidak</button>
<button type="submit" class="btn btn-success">Ya</button>
</div>
</div>
</div>
</div>
</form>
<!-- End Modal Delete Status-->
<?= $this->endSection() ?>
<?= $this->section('script-js') ?>
<script>
$(document).ready(function(){
// get Delete News
$('.btn-delete-news').on('click',function(){
// get data from button edit
const id = $(this).data('id');
// Set data to Form Edit
$('.id').val(id);
// Call Modal Edit
$('#deleteModalNews').modal('show');
});
});
</script>
<?= $this->endSection() ?>
Tampilan daftar berita setelah diupdate
Konfirmasi sebelum hapus data
Ketiga
Tambahkan fungsi hapus (delete) pada Controller seperti dibawah ini
public function delete()
{
$model = new NewsModel();
$model->where('id', $this->request->getVar('id'))->delete();
return redirect()->to(base_url('/news/list?page=1'));
}
Fungsi disini menghapus data secara permanen. Atau bisa juga dimodifikasi tanpa menghapus data yaitu dengan cara menambahkan satu field lagi sebagai status data terhapus atau masih aktif.
Nah kalau sudah ditambah field status maka fungsi delete diatas diganti dengan update scriptnya seperti berikut
public function delete()
{
$model = new NewsModel();
$data = [
'active' => 0
];
$model->update($this->request->getVar('id'), $data);
return redirect()->to(base_url('/news/list?page=1'));
}
Jangan lupa juga untuk menambahkan kriteria pada model (app\Models\NewsModel.php) seperti berikut yang fungsinya hanya menampilkan data active saja
public function getNews($id = '')
{
if ($id === '')
{
return $this->asObject()
->where(['active' => 1])
->orderBy('publish_date', 'desc')
->findAll();
}
return $this->asObject()
->where(['id' => $id, 'active' => 1])
->first();
}
Akhirnya
Selesai sudah tutorial CRUD (Create, Read, Update, dan Delete). Semoga bermanfaat.
