Assalamualaikum Warahmatullahi Wabarakatuh, Pada artikel ini adalah lanjutan dari artikel sebelumnya. Jadi silahkan simak secara runtut untuk dapat lebih mendalami tentang membuat crud sederhana menggunakan laravel 10. Pada sesi kali ini saya akan membahas cara mengubah data dari database menggunakan Laravel 10.
Silahkan lakukan secara berurutan sesuai artikel ini ya
Table of Contents
Routes
Langkah pertama kita mengubah routes terlebih dahulu. Karena pengaksesan awal dari sebuah aplikasi website yang pertama dijalankan adalah membaca routes. Jika client ingin mengakses url tertentu, maka sistem akan membaca melalui rotes terlebih dahulu apakah url/route tesebut tersedia atau nggak atau methodnya diperbolehkan apa tidak.
Silahkan salin kode dibawah ini
Route::match(['get', 'post'],'/{id}/ubah',[ BukuController::class, "ubahData" ])->name('ubahData');Kali ini kita menggunakan route match, yang dimana dalam 1 url bisa melakukan http post maupun get, tanpa perlu kita mendefinisikan kedua-duanya, dengan route match sistem akan otomatis mendeteksi url tersebut apakah method get atau post tergantung isi dalam array tersebut. Apa saja yang bisa kita isikan dalam array tersebut? pastinya macam-macam method http dong, silahkan baca ini.
Ubah Controller
Kita ubah terlebih dahulu pada function dataTables. Karena didalam kode tersebut terdapat button untuk menghapus data, kita harus memodifikasi sesuai yang kita butuhkan. Silahkan ubah pada function dataTable seluruhnya menggunakan kode dibawah ini.
untuk mengetahui perubahannya dimana, silahkan lihat pada comment // kode baru .
Setelah itu buka app/Http/Controllers/BukuController.php, silahkan tambahkan kode dibawah ini didalam class BukuControllers, pastikan method ubahData harus ada ya, karena pada routes kita mendefinisikan method yang kita panggil ialah method ubahData
public function ubahData($id,Request $request)
{
$buku = Buku::findOrFail($id);
if ($request->isMethod('post')) {
$this->validate($request, [
'judul_buku' => 'required|string|max:200|min:3',
'deskripsi_buku' => 'required|string|min:5',
'tahun_terbit' => 'required|min:4|max:4',
'stok_buku' => 'required|numeric',
'gambar_buku' => 'image|mimes:jpg,png,jpeg,gif,svg|max:1024'
]);
$img_old = $buku->gambar_buku;
if ($request->file('gambar_buku') != null) {
# hapus img lama
if ($img_old && file_exists(public_path().$img_old)) {
unlink(public_path().$img_old);
# sukses hapus
}
$nama_gambar = time() . '_' . $request->file('gambar_buku')->getClientOriginalName();
$upload = $request->gambar_buku->storeAs('public/sampul_buku', $nama_gambar);
$img_old = Storage::url($upload);
}
$buku->update([
'judul_buku' => $request->judul_buku,
'deskripsi_buku' => $request->deskripsi_buku,
'tahun_terbit' => $request->tahun_terbit,
'stok_buku' => $request->stok_buku,
'gambar_buku' => $img_old
]);
return redirect()->route('ubahData',['id' => $buku->id])->with('status', 'Data telah tersimpan di database');
}
return view('crudapp.ubah', [
'buku' => $buku
]);
}Penjelasan:
Pada function ubahData terdapat 2 params, yaitu variable id sebagai menerima data id dari url, dan variable request untuk mendapatkan request method get/post.
Cek apakah request http berupa post atau bukan.
Jika bukan request methodnya post alias method get, sistem akan memanggil function view untuk menampilkan layout ubah, dengan melampar variable buku untuk ditampilkan datanya pada layout.
Jika request methodnya post, maka akan terjadi pembaruan data.
Pertama kali sistem akan melakukan validasi inputan.
$this->validate($request, [
'judul_buku' => 'required|string|max:200|min:3',
'deskripsi_buku' => 'required|string|min:5',
'tahun_terbit' => 'required|min:4|max:4',
'stok_buku' => 'required|numeric',
'gambar_buku' => 'image|mimes:jpg,png,jpeg,gif,svg|max:1024'
]);Dalam kode diatas adalah proses validasi inputan, yang dimana kolom:
- judul_buku harus terisi, harus bertipe string/karakter, dan minimal 3 huruf maksimal 200 huruf/string
- deskripsi_buku harus terisi, harus bertipe string/karakter, dan minimal huruf maksimal 5
- tahun_terbit harus terisi, dan minimal huruf maksimal 4 minimal 4
- stok_buku harus terisi, dan harus bertipe integer/numeric
- gambar_buku tidak harus terisi, file berformat harus gambar, dan maksimal file 1 mb
Setelah itu kita buat variable img_old untuk menampung data alamat gambar yang lama.
$img_old = $buku->gambar_buku;Lalu sistem akan mengecek apakah pada form ubah data pengguna melakukan attachment file pada kolom gambar buku.
if ($request->file('gambar_buku') != null) {
# hapus fimg lama
if ($img_old && file_exists(public_path().$img_old)) {
unlink(public_path().$img_old);
# sukses hapus
}
$nama_gambar = time() . '_' . $request->file('gambar_buku')->getClientOriginalName();
$upload = $request->gambar_buku->storeAs('public/sampul_buku', $nama_gambar);
$img_old = Storage::url($upload);
}Jika pengguna melalukan attachment file maka akan terjadi proses penghapusan file yang lama. Jika img_old tidak kosong dan terdapat file yang serupa didalam alamat gambar tersebut, maka akan terjadi proses penghapusan file.
# hapus fimg lama
if ($img_old && file_exists(public_path().$img_old)) {
unlink(public_path().$img_old);
# sukses hapus
}Setelah proses penghapusan file lama selesai, sistem akan melanjutkan ke upload file gambar yang akan ditunjukkan pada kode dibawah;
$nama_gambar = time() . '_' . $request->file('gambar_buku')->getClientOriginalName();
$upload = $request->gambar_buku->storeAs('public/sampul_buku', $nama_gambar);
$img_old = Storage::url($upload);Pada variable nama_gambar ialah menampung nama file gambar yang diubah menjadi format date-namafileori.ekstensifile, contohnya 1641170702_pwa.png.
Lalu pada variable upload ialah proses upload file ke dalam folder storage/public/sampul_buku.
Setelah upload selesai, kita membutuhkan url dari file tersebut untuk disimpan pada database, maka dari itu kita membutuhkan Facades\Storage::url() untuk mendapatkan alamat lokasi filenya. Contohnya akan seperti ini hasil yang disimpan ke database /storage/sampul_buku/1641170702_pwa.png .
Kita timpa variable img_old tadi yang semula dari database sekarang ditimpa dengan alamat baru dari gambar yang barusan di attachment pada form ubah. Lalu berjalan ke proses update data.
$buku->update([
'judul_buku' => $request->judul_buku,
'deskripsi_buku' => $request->deskripsi_buku,
'tahun_terbit' => $request->tahun_terbit,
'stok_buku' => $request->stok_buku,
'gambar_buku' => $img_old
]);Jika tidak melalukan attachment file pada from ubah, sistem akan langsung melalukan proses update data seperti pada kode diatas.
Setelah proses telah selesai semua, sistem akan langsung redirect/refresh ke halaman dimana kita mengisi form mengubah data dengan session status success.
return redirect()->route('ubahData',['id' => $buku->id])->with('status', 'Data telah tersimpan di database');
Layouting
Jangan lupa untuk buat form inputan tambah buku, silahkan salin kode dibawah ini, letakkan pada folder resources/views/crudapp, berikan nama file ubah.blade.php.
Jalankan Server
Akhir dari sesi ini, pastinya kalian harus cobain dong.
Jalankan server local kalian, bisa menggunakan perintah dibawah ini
php artisan servemaupun jika menggunakan laragon atau apapun. setelah itu silahkan buka melalui browser lalu akses ke url domain-mu/. Pilih data yang akan diubah, tekan tombol yang ada icon pensil warna biru.
Hasil Percobaan
Silahkan lihat video ini
Oke sampai sini kita telah berhasil melakukan mengubah data dengan Laravel 9.
Wassalamualaikum Warahmatullahi Wabarakatuh.
Nah selanjutnya, bagaimana caranya menghapus data tanpa reload halaman?
Simak di artikel selanjutnya
Belajar Laravel 10 : A simple guide CRUD app - Menghapus Data
Baca sesi lainnya:
Belajar Laravel 10 : A simple guide CRUD app - Menambah Data
Belajar Laravel 10 : A simple guide CRUD app - Menampilkan Data
Belajar Laravel 10 : A simple guide CRUD app - Mengubah Data
Belajar Laravel 10 : A simple guide CRUD app - Menghapus Data
Comments