Tutorial kali ini merupakan kelanjutan dari tutorial sebelumnya, yaitu membuat Membuat Aplikasi Perpustakaan Berbasis Web dengan PHP Mulai dari Nol dan https://agussuratna.net/2022/02/14/membuat-aplikasi-perpustakaan-berbasis-web-dengan-php-dan-bootstrap/, jadi sebaiknya sebelum mengikuti tutorial ini buat dahulu project seperti pada tutorial sebelumnya.
Sebelum membuat aplikasi perpustakaan tersebut, sebaiknya kita membuat dulu sitemap dari apliasi tersebut, berikut sitemap untuk aplikasi yang akan kita buat :
Dari sitemap kita bisa lihat akan ada menu/halaman apa saja yang akan kita buat, diantaranya Home, Data Buku, Data Siswa, Data Petugas, Peminjaman dan Logout.
Berikut tahapan-tahapan cara membuat Aplikasi Perpustakaan berbasis web dengan Laravel dan Bootstrap :
- Buat project laravel di dalam htdocs dengan nama perpustakaanlaravel, cara membuat project laravel silahkan baca di tutorial Instalasi laravel
- Jangan lupa tambahkan properti $namespace di file RouteServiceProvider.php yang ada dalam folder app\Providers dan tambahkan sintak di sebelah atas method public function boot() seperti dibawah ini :
protected $namespace = 'App\\Http\\Controllers';
dan tambahkan sintak :
->namespace($this->namespace)
di dalam method routes function(), seperti gambar di bawah ini :
- Buat database dengan nama perpustakaan, di dalamnya terdapat table tbl_buku, tbl_siswa, tbl_petugas dan tbl_peminjaman, dengan skema database seperti berikut :
Atau bisa download databasenya di sini - Koneksikan project laravel perpustakaanlaravel dengan database perpustakaan, buka file .env yang ada dalam project perpustakaanlaravel, ubah nama database dalam file .env menjadi DB_DATABASE=perpustakaan seperti berikut :
DB_CONNECTION=mysql DB_HOST=127.0.0.1 DB_PORT=3306 DB_DATABASE=perpustakaan DB_USERNAME=root DB_PASSWORD=
- Di dalam folder public yang ada dalam project perpustakaanlaravel tersebut buat folder assets untuk menampung file-file bootstrap, cara instalasi bootstrap bisa dibaca pada tutorial berikut https://agussuratna.net/2021/02/06/pengertian-dan-cara-menggunakan-bootstrap/ . Copy file-file bootstrap ke dalam folder assets tersebut, sehingga susunan folder dan filenya jadi seperti berikut ini :
Karena untuk bagian javascript-nya Bootstrap menggunakan jQuery, jadi jangan lupa untuk menambahkan juga file jquery pada folder js bootstrap atau letakkan sesuai keinginan kita asalkan direktori saat menghubungkan file css dan js nanti sesuai. Untuk jquery bisa didownload disini. - Di dalam folder public tersebut buat juga folder gambar yang berfungsi untuk menampung gambar yang diperlukan halaman web, isi folder tersebut dengan gambar yang diperlukan seperti contoh berikut :
- Buat route untuk membuat link sesuai dengan sitemap seperti gambar di atas pada file perpustakaanlaravel/routes/web.php dengan sintak seperti berikut ini :
<?php use Illuminate\Support\Facades\Route; Route::get('/', function () { return view('index'); }); //Route untuk Data Buku Route::get('/buku', 'BukuController@bukutampil'); //Route untuk Data Siswa Route::get('/siswa', 'SiswaController@bukutampil'); //Route untuk Data Petugas Route::get('/petugas', 'PetugasController@bukutampil'); //Route untuk Data Peminjaman Route::get('/peminjaman', 'PeminjamanController@bukutampil'); - Perhatikan pada sintak route di atas, terdapat sintak :
Route::get('/', function () { return view('index'); });Dari sintak tersebut dapat dilihat link utamanya ( / ) akan diarahkan untuk menampilkan view yang bernama index, selanjutnya kita buat view yang bernama index tersebut di dalam folder perpustakaanlaravel/resources/views dengan file name index.blade.php, isi dengan sintak seperti berikut ini :
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Perpustakaan SMK Negeri 1 Cimahi</title> <link rel="stylesheet" type="text/css" href="{{ asset('assets') }}/css/bootstrap.css"> <script type="text/javascript" src="{{ asset('assets') }}/js/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="{{ asset('assets') }}/js/bootstrap.js"></script> </head> <body> <div class="container" style="background:#ccc"> <!--awal MENU NAVBAR--> <div> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link" href="/home">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="/buku">Data Buku</a> </li> <li class="nav-item"> <a class="nav-link" href="/siswa">Data Siswa</a> </li> <li class="nav-item"> <a class="nav-link" href="/petugas">Data Petugas</a> </li> <li class="nav-item"> <a class="nav-link" href="/pinjam">Data Peminjaman</a> </li> <li class="nav-item"> <a class="nav-link" href="/logout">Logout</a> </li> </ul> </div> </nav> </div> <!--akhir MENU NAVBAR--> <!--awal BANNER--> <div class="col-md-12"> <img src="{{ asset('gambar') }}/banner.jpg" width="100%" height="250px"> </div> <!--akhir BANNER--> <p> <div class="col-md-12"> <div class="row" style="background:#ccc"> <!--awal SIDEBAR--> <div class="col-md-3"> <img src="{{ asset('gambar') }}/sidebar.jpg" width="100%" height="100%"> </div> <!--akhir SIDEBAR--> <!--awal KONTEN--> <div class="col-md-9"> </div> <!--akhir KONTEN--> </div> </div> <p> <!--awal FOOTER--> <div class="col-md-12"> <div class="row" style="background:rgba(63, 67, 102, 0.562)"> <div class="col-md-9"> <h3>Visi</h3> <p>Terwujudnya Indonesia Cerdas Melalui Gemar Membaca Dengan Memberdayakan Perpustakaan <p> <h3>Misi</h3> <ul> <li>Terwujudnya layanan prima</li> <li>Terwujudnya perpustakaan sebagai pelestari khazanah budaya bangsa</li> <li>Terwujudnya perpustakaan sesuai standar nasional perpustakaan</li> </ul> </div> <div class="col-md-3"> Copyright © 2017. All right reserve <p> Developed by The Letter</div> </div> </div> <!--akhir FOOTER--> </div> </body> </html>Perhatikan pada tag <head> dan </head> terdapat sintak :
<link rel="stylesheet" type="text/css" href="{{ asset('assets') }}/css/bootstrap.css"> <script type="text/javascript" src="{{ asset('assets') }}/js/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="{{ asset('assets') }}/js/bootstrap.js"></script>Sintak tersebut untuk menghubungkan Bootstrap, jQuery dan javaScript. Untuk cara koneksi Bootstrap silahkan pelajari kembali materi tentang Bootstrap sini
- Selanjutnya kita coba akses halaman yang sudah kita buat tadi dengan alamat http://localhost:8000, dan hasilnya seperti berikut ini :
- Selanjutnya untuk mempermudah dalam mengatur konten kita modifikasi file pertama kita buat file view baru dengan nama menu.blade.php, banner.blade.php, sidebar.blade.php, konten.blade.php dan footer.blade.php.
- Kita cut sintak pada index.blade.php pada bagian menu dan paste pada file menu.blade.php, sehingga file menu.blade.php menjadi seperti berikut ini :
<!--awal MENU NAVBAR--> <div> <nav class="navbar navbar-expand-lg navbar-light bg-light"> <div> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link" href="/home">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="/buku">Data Buku</a> </li> <li class="nav-item"> <a class="nav-link" href="/siswa">Data Siswa</a> </li> <li class="nav-item"> <a class="nav-link" href="/petugas">Data Petugas</a> </li> <li class="nav-item"> <a class="nav-link" href="/pinjam">Data Peminjaman</a> </li> <li class="nav-item"> <a class="nav-link" href="/logout">Logout</a> </li> </ul> </div> </nav> </div> <!--akhir MENU NAVBAR--> - Selanjutnya kita cut sintak pada index.blade.php pada bagian banner dan paste pada file banner.blade.php, sehingga file banner.blade.php menjadi seperti berikut ini :
<!--awal BANNER--> <div class="col-md-12"> <img src="{{ asset('gambar') }}/banner.jpg" width="100%" height="250px"> </div> <!--akhir BANNER--> - Selanjutnya kita cut sintak pada index.blade.php pada bagian sidebar dan paste pada file sidebar.blade.php, sehingga file sidebar.blade.php menjadi seperti berikut ini :
<p> <div class="col-md-12"> <div class="row" style="background:#ccc"> <!--awal SIDEBAR--> <div class="col-md-3"> <img src="{{ asset('gambar') }}/sidebar.jpg" width="100%" height="100%"> </div> <!--akhir SIDEBAR--> - Selanjutnya kita cut sintak pada index.blade.php pada bagian konten dan paste pada file konten.blade.php serta tambahkan satu baris sintak, sehingga file konten.blade.php menjadi seperti berikut ini :
<!--awal KONTEN--> <div class="col-md-9"> @yield('isihalaman') </div> <!--akhir KONTEN--> </div> </div>Perhatikan pada sintak di atas, terdapat @yield(‘isihalaman’), sintak tersebut akan menampilkan data dari beberapa halaman yang berbeda ketika halaman tersebut memanggil fungsi @yield yang mempunyai parameter ‘isihalaman’
- Selanjutnya kita cut sintak pada index.blade.php pada bagian footer dan paste pada file footer.blade.php, sehingga file footer.blade.php menjadi seperti berikut ini :
-
<p> <!--awal FOOTER--> <div class="col-md-12"> <div class="row" style="background:rgba(63, 67, 102, 0.562)"> <div class="col-md-9"> <h3>Visi</h3> <p>Terwujudnya Indonesia Cerdas Melalui Gemar Membaca Dengan Memberdayakan Perpustakaan <p> <h3>Misi</h3> <ul> <li>Terwujudnya layanan prima</li> <li>Terwujudnya perpustakaan sebagai pelestari khazanah budaya bangsa</li> <li>Terwujudnya perpustakaan sesuai standar nasional perpustakaan</li> </ul> </div> <div class="col-md-3"> Copyright © 2017. All right reserve <p> Developed by The Letter</div> </div> </div> <!--akhir FOOTER--> - Pada file index.blade.php kita ubah sintaknya menjadi seperti berikut :
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Perpustakaan SMK Negeri 1 Cimahi | @yield('title')</title> <link rel="stylesheet" type="text/css" href="{{ asset('assets') }}/css/bootstrap.css"> <script type="text/javascript" src="{{ asset('assets') }}/js/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="{{ asset('assets') }}/js/bootstrap.js"></script> </head> <body> <div class="container" style="background:#ccc"> @include('menu') @include('banner') @include('sidebar') @include('konten') @include('footer') </div> </body> </html>Perhatikan sintak di atas, kita menggunakan @include untuk memanggil masing-masing file yang sudah kita buat. Selain itu diantara tag <head> dan </head> terdapat sintak :
<title>Perpustakaan SMK Negeri 1 Cimahi | @yield('title')</title>yang berfungsi untuk memanggil nama title pada view yang dipanggilnya.
- Perhatikan pada file menu.blade.php, di situ terdapat beberapa menu diantaranya /buku, /siswa dan /petugas. Selanjutnya kita buat view untuk masing-masing menu tersebut, pertama kita buat folder baru dengan nama halaman di dalam folder resources/views. Di dalam folder halaman kita buat file baru dengan nama view_home.blade.php, view_buku.blade.php, view_siswa.blade.php dan view_petugas.blade.php. Sehingga susunan file dalam folder views menjadi seperti berikut :
- Selanjutnya kita isi view_home.php dengan sintak seperti berikut :
@extends('index') @section('title', 'Home') @section('isihalaman') <h3>Pengertian perpustakaan menurut para ahli</h3> <p> <h4>Menurut Prof. Sulistyo Basuki</h4> Perpustakaan adalah sebuah ruangan, bagian sebuah Gedung ataupun gedung itu sendiri yang digunakan untuk menyimpan buku dan terbitan lainnya yang biasanya disimpan menurut tata susunan tertentu untuk digunakan pembaca, bukan untuk dijual. Dalam pengertian buku dan terbitan lainnya termasuk di dalamnya semua bahan cetak, buku, majalah, laporan, pamflet, prosiding, manuskrip (naskah), lembaran musik, berbagai karya musik, berbagai karya media audio visual seperti film, slid ( slide), kaset, piringan hitam, bentuk mikro seperti mikrofilm, mikrofis, dan mikro buram ( micro opaque ). Webster menyatakan bahwa perpustakaan merupakan kumpulan buku, manuskrip, dan bahan pustaka lainnya yang digunakan untuk keperluan studi `atau bacaan, kenyamanan, atau kesenangan. <p> <h4>Menurut Lasa HS</h4> Menurut Lasa HS, Perpustakaan merupakan kumpulan atau bangunan fisik sebagai tempat buku dikumpulkan dan disusun berdasarkan sistem tertentu atau keperluan pengguna. <p> <h4>Menurut Mudyana dan Royani</h4> “Perpustakaan sekolah adalah sarana penunjang pendidikan di satu pihak sebagai pelestari ilmu pengetahuan, dan di lain pihak sebagai sumber bahan pendidikan yang akan diwariskan kepada generasi yang lebih muda. Secara nyata perpustakaan sekolah merupakan sarana untuk proses belajar dan mengajar bagi guru maupun bagi murid”. <p> <h4>Perpustakaan Menurut UU NO 43. THN. 2007</h4> Perpustakaan adalah institusi yang mengumpulkan pengetahuan tercetak dan terekam, mengelolanya dengan cara khusus guna memenuhi kebutuhan intelektualitas para penggunanya melalui berbagai cara interaksi pengetahuan. @endsectionPada sintak di atas terdapat @extends(‘index’) yang menjelaskan bahwa halaman view_home.blade.php merupakan bagian dari halaman index.blade.php, terdapat juga @section(‘title’, ‘Home’) yang artinya kata Home merupakan bagian (section) dari title, dimana section tersebut sebelumnya dipanggil pada halaman yang akan menambahkan kata Home pada title di browser
- Dalam file view_buku.blade.php kita buat sintak seperti berikut :
@extends('index') @section('title', 'Buku') @section('isihalaman') <h2><center>Daftar Buku Perpustakaan SMK Negeri 1 Cimahi</center></h2> @endsectionPada sintak di atas terdapat @extends(‘index’) yang menjelaskan bahwa halaman view_buku.blade.php merupakan bagian dari halaman index.blade.php, terdapat juga @section(‘title’, ‘Buku’) yang artinya kata Buku merupakan bagian (section) dari title, dimana section tersebut sebelumnya dipanggil pada halaman yang akan menambahkan kata Buku pada title di browser
- Selanjutnya perhatikan pada route yang terdapat pada file perpustakaanlaravel/routes/web.php terdapat route untuk menampilkan data buku
Route::get('/buku', 'BukuController@bukutampil');Terdapat parameter BukuController@bukutampil, dimana BukuController merupakan nama controller dan bukutampil nama method yang terdapat dalam controller BukuController. Oleh karena itu sekarang kita buat controller menggunakan perintah
php artisan make:controller BukuController
- Di dalam controller BukuController.php kita tambahkan sintak seperti berikut :
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; //panggil model BukuModel use App\Models\BukuModel; class BukuController extends Controller { //method untuk tampil data buku public function bukutampil() { $databuku = BukuModel::orderby('kodebuku', 'ASC') ->paginate(5); return view('halaman/view_buku',['buku'=>$databuku]); } }Perhatikan sintak di atas, terdapat terdapat use App\Models\BukuModel; yang berfungsi untuk memanggil model yang bernama BukuModel.php. Terdapat juga methode yang bernama bukutampil
public function bukutampil() { $databuku = BukuModel::orderby('kodebuku', 'ASC') ->paginate(5); return view('halaman/view_buku',['buku'=>$databuku]); }BukuModel::orderby(‘kodebuku’, ‘ASC’) berfungsi untuk mengambil data buku yang terdapat di dalam database melalui model BukuModel.php, diurutkan secara ascending berdasarkan kodebuku. Data tersebut disimpan ke variable $databuku, dan akan ditampilkan dengan teknik pagination/paginate(5), 5 merupakan pamater dari fungsi paginate tersebut, yang merupakan jumlah data 5 per halaman, jumlahnya bisa kita atur per halaman mau berpa data ditampilkan. Data tersebut di kirim ke view view_buku yang terdapat dalam folder halaman
return view('halaman/view_buku',['buku'=>$databuku]); - Selanjutnya kita buatkan model yang bernama BukuModel, menggunakan perintah
php artisan make:model BukuModel
Dalam model app/Models/BukuModel.php, tambahkan sintak seperti berikut :
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class BukuModel extends Model { use HasFactory; protected $table = "tbl_buku"; protected $primaryKey = "idbuku"; protected $fillable = ['idbuku','kodebuku','judul','pengarang','penerbit']; }protected $table = “tbl_buku”; menyatkan bahwa table yang terkoneksi dengan BukuModel bernama tbl_buku bukan tbl_bukus. protected $primaryKey = “idbuku”; menyatakan bahwa primarykeynya idbuku bukan id. Sedangkan protected $fillable = [‘idbuku’,’kodebuku’,’judul’,’pengarang’,’penerbit’]; menyatakan bahwa field yang bisa diisi datanya idbuku, kodebuku, judul, pengarang dan penerbit.
- Selanjutnya pada file view_buku.blade.php kita akan menampilkan data yang terdapat pada table tbl_buku, dengan sintak seperti berikut :
@extends('index') @section('title', 'Buku') @section('isihalaman') <h3><center>Daftar Buku Perpustakaan SMK Negeri 1 Cimahi</center></h3> <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalBukuTambah"> Tambah Data Buku </button> <p> <table class="table table-bordered table-striped"> <thead> <tr> <td align="center">No</td> <td align="center">ID Buku</td> <td align="center">Kode Buku</td> <td align="center">Judul Buku</td> <td align="center">Pengarang</td> <td align="center">Penerbit</td> <td align="center">Aksi</td> </tr> </thead> <tbody> @foreach ($buku as $index=>$bk) <tr> <td align="center" scope="row">{{ $index + $buku->firstItem() }}</td> <td>{{$bk->idbuku}}</td> <td>{{$bk->kodebuku}}</td> <td>{{$bk->judul}}</td> <td>{{$bk->pengarang}}</td> <td>{{$bk->penerbit}}</td> <td align="center"> <button class="btn-warning"> Edit </button> | <a href="buku/hapus/{{$bk->idbuku}}" onclick="return confirm('Yakin mau dihapus?')"> <button class="btn-danger"> Delete </button> </a> </td> </tr> @endforeach </tbody> </table> <!--awal pagination--> Halaman : {{ $buku->currentPage() }} <br /> Jumlah Data : {{ $buku->total() }} <br /> Data Per Halaman : {{ $buku->perPage() }} <br /> {{ $buku->links() }} <!--akhir pagination--> <!-- Awal Modal tambah data Buku --> <div class="modal fade" id="modalBukuTambah" tabindex="-1" role="dialog" aria-labelledby="modalBukuTambahLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalBukuTambahLabel">Form Input Data Buku</h5> </div> <div class="modal-body"> <form name="formbukutambah" id="formbukutambah" action="/buku/tambah " method="post" enctype="multipart/form-data"> @csrf <div class="form-group row"> <label for="idbuku" class="col-sm-4 col-form-label">Kode Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="kodebuku" name="kodebuku" placeholder="Masukan Kode Buku"> </div> </div> <p> <div class="form-group row"> <label for="judul" class="col-sm-4 col-form-label">Judul Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="judul" name="judul" placeholder="Masukan Judul Buku"> </div> </div> <p> <div class="form-group row"> <label for="pengarang" class="col-sm-4 col-form-label">Nama Pengarang</label> <div class="col-sm-8"> <input type="text" class="form-control" id="pengarang" name="pengarang" placeholder="Masukan Nama Pengarang"> </div> </div> <p> <div class="form-group row"> <label for="penerbit" class="col-sm-4 col-form-label">Penerbit</label> <div class="col-sm-8"> <input type="text" class="form-control" id="penerbit" name="penerbit" placeholder="Masukan Nama Penerbit"> </div> </div> <p> <div class="modal-footer"> <button type="button" name="tutup" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button> <button type="submit" name="bukutambah" class="btn btn-success">Tambah</button> </div> </form> </div> </div> </div> </div> <!-- Akhir Modal tambah data buku --> @endsectionPerhatikan sintak di atas, untuk menampilkan datanya menggunakan looping dengan fungsi
@foreach ($buku as $index=>$bk)
variable $buku merupakan variable yang dikirim dari controller BukuController.php yang dialiaskan menjadi $bk.
Selain itu terdapat sintak untuk menampilkan pagination pada halaman buku tersebut, hal ini untuk membatasi tampilan web dengan cara data ditampilkan dibagi-bagi menjadi beberapa halaman
<!--awal pagination--> Halaman : {{ $buku->currentPage() }} <br /> Jumlah Data : {{ $buku->total() }} <br /> Data Per Halaman : {{ $buku->perPage() }} <br /> {{ $buku->links() }} <!--akhir pagination-->Sintak pagination pada laravel tersebut akan langsung tampil, tetapi tampilannya akan berantakan. Untuk mengatasinya kita buka file RouteServiceProvider.php yang terdapat dalam folder app/Providers, tambahkan sintak :
use Illuminate\Pagination\Paginator;
di atas sintak class RouteServiceProvider extends ServiceProvider. Selanjutnya tambahkan sintak :
Paginator::useBootstrap();
di dalam methode public function boot().
Selanjutnya kita akses halaman tersebut dengan alamat http://localhost:8000/buku, sehingga tampilannya menjadi seperti berikut :
- Pada view_buku.blade.php terdapat button Tambah Data Buku
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalBukuTambah"> Tambah Data Buku </button>Button tersebut akan memanggil form dengan menggunakan Modal Bootstrap dengan id modalBukuTambah.
<!-- Awal Modal tambah data Buku --> <div class="modal fade" id="modalBukuTambah" tabindex="-1" role="dialog" aria-labelledby="modalBukuTambahLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalBukuTambahLabel">Form Input Data Buku</h5> </div> <div class="modal-body"> <form name="formbukutambah" id="formbukutambah" action="/buku/tambah " method="post" enctype="multipart/form-data"> @csrf <div class="form-group row"> <label for="idbuku" class="col-sm-4 col-form-label">Kode Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="kodebuku" name="kodebuku" placeholder="Masukan Kode Buku"> </div> </div> <p> <div class="form-group row"> <label for="judul" class="col-sm-4 col-form-label">Judul Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="judul" name="judul" placeholder="Masukan Judul Buku"> </div> </div> <p> <div class="form-group row"> <label for="pengarang" class="col-sm-4 col-form-label">Nama Pengarang</label> <div class="col-sm-8"> <input type="text" class="form-control" id="pengarang" name="pengarang" placeholder="Masukan Nama Pengarang"> </div> </div> <p> <div class="form-group row"> <label for="penerbit" class="col-sm-4 col-form-label">Penerbit</label> <div class="col-sm-8"> <input type="text" class="form-control" id="penerbit" name="penerbit" placeholder="Masukan Nama Penerbit"> </div> </div> <p> <div class="modal-footer"> <button type="button" name="tutup" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button> <button type="submit" name="bukutambah" class="btn btn-success">Tambah</button> </div> </form> </div> </div> </div> </div> <!-- Akhir Modal tambah data buku -->Jadi ketika tombol Tambah Data Buku diklik akan muncul pop-up yang menampilkan form untuk menambah data, seperti berikut :
-
Dalam modalBukuTambah tersebut terdapat form dengan action yang diarahkan ke alamat /buku/tambah
<form name="formbukutambah" id="formbukutambah" action="/buku/tambah " method="post" enctype="multipart/form-data">
Oleh karena itu selanjutnya kita buatkan route baru pada routes/web.php
Route::post('/buku/tambah','BukuController@bukutambah');Pada route tersebut terdapat BukuController@bukutambah, yang artinya pada controller app/Http/Controllers/BukuController.php kita buatkan methode baru yang bernama bukutambah. Kita buka kembali controller BukuController.php tersebut dan tambahkan sintak menjadi seperti berikut :
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; //panggil model BukuModel use App\Models\BukuModel; class BukuController extends Controller { //method untuk tampil data buku public function bukutampil() { $databuku = BukuModel::orderby('kodebuku', 'ASC') ->paginate(5); return view('halaman/view_buku',['buku'=>$databuku]); } //method untuk tambah data buku public function bukutambah(Request $request) { $this->validate($request, [ 'kodebuku' => 'required', 'judul' => 'required', 'pengarang' => 'required', 'penerbit' => 'required' ]); BukuModel::create([ 'kodebuku' => $request->kodebuku, 'judul' => $request->judul, 'pengarang' => $request->pengarang, 'penerbit' => $request->penerbit ]); return redirect('/buku'); } }Pada method bukutambah kita tidak menyertakan idbuku, hal ini dikarenakan idbuku merupakan auto increment yang otomatis terisi. Kita coba tambah datanya dan hasilnya data tersebut berhasil tersimpan ke dalam database, dan ditampilkan di halaman data buku :
- Pada view_buku.blade.php terdapat button Delete
<a href="buku/hapus/{{$bk->idbuku}}" onclick="return confirm('Yakin mau dihapus?')"> <button class="btn-danger"> Delete </button> </a>Selanjutnya kita buatkan route baru pada routes/web.php
Route::get('/buku/hapus/{idbuku}','BukuController@bukuhapus');Pada route tersebut terdapat BukuController@bukuhapus, yang artinya pada controller app/Http/Controllers/BukuController.php kita buatkan methode baru yang bernama bukuhapus. Kita buka kembali controller BukuController.php tersebut dan tambahkan sintak menjadi seperti berikut :
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; //panggil model BukuModel use App\Models\BukuModel; class BukuController extends Controller { //method untuk tampil data buku public function bukutampil() { $databuku = BukuModel::orderby('kodebuku', 'ASC') ->paginate(5); return view('halaman/view_buku',['buku'=>$databuku]); } //method untuk tambah data buku public function bukutambah(Request $request) { $this->validate($request, [ 'kodebuku' => 'required', 'judul' => 'required', 'pengarang' => 'required', 'penerbit' => 'required' ]); BukuModel::create([ 'kodebuku' => $request->kodebuku, 'judul' => $request->judul, 'pengarang' => $request->pengarang, 'penerbit' => $request->penerbit ]); return redirect('/buku'); } //method untuk hapus data buku public function bukuhapus($idbuku) { $databuku=BukuModel::find($idbuku); $databuku->delete(); return redirect()->back(); } }Perhatikan sintak di atas, pada method tersebut dengan parameter $idbuku yang didapatkan dari halaman buku, datanya dicari berdasarkan $idbuku menggunakan fungsi find(), setelah datanya didapat selanjutnya data tersebut dihapus menggunakan fungsi delete(), setelah dihapus diarahkan kembali ke halaman sebelumnya menggunakan fungsi return redirect()->back();. Kita coba hapus salah satu datanya dan berhasil dihapus dari database, seperti berikut :
- Pada view view_buku.blade.php terdapat button untuk mengedit data :
<button class="btn-warning"> Edit </button>
Kita ubah button tersebut dengan menambahkan sintak untuk memanggil form edit dengan menggunakan Modal Bootstrap, kita ubah dan tambahkan sintak seperti berikut :
<button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modalBukuEdit{{$bk->idbuku}}"> Edit </button> <!-- Awal Modal EDIT data Buku --> <div class="modal fade" id="modalBukuEdit{{$bk->idbuku}}" tabindex="-1" role="dialog" aria-labelledby="modalBukuEditLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalBukuEditLabel">Form Edit Data Buku</h5> </div> <div class="modal-body"> <form name="formbukuedit" id="formbukuedit" action="/buku/edit/{{ $bk->idbuku}} " method="post" enctype="multipart/form-data"> @csrf {{ method_field('PUT') }} <div class="form-group row"> <label for="idbuku" class="col-sm-4 col-form-label">Kode Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="kodebuku" name="kodebuku" value="{{ $bk->kodebuku}}"> </div> </div> <p> <div class="form-group row"> <label for="judul" class="col-sm-4 col-form-label">Judul Buku</label> <div class="col-sm-8"> <input type="text" class="form-control" id="judul" name="judul" value="{{ $bk->judul}}"> </div> </div> <p> <div class="form-group row"> <label for="pengarang" class="col-sm-4 col-form-label">Nama Pengarang</label> <div class="col-sm-8"> <input type="text" class="form-control" id="pengarang" name="pengarang" value="{{ $bk->pengarang}}"> </div> </div> <p> <div class="form-group row"> <label for="penerbit" class="col-sm-4 col-form-label">Penerbit</label> <div class="col-sm-8"> <input type="text" class="form-control" id="penerbit" name="penerbit" value="{{ $bk->penerbit}}"> </div> </div> <p> <div class="modal-footer"> <button type="button" name="tutup" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button> <button type="submit" name="bukutambah" class="btn btn-success">Edit</button> </div> </form> </div> </div> </div> </div> <!-- Akhir Modal EDIT data buku -->Dalam modalBukuEdit tersebut terdapat form dengan action yang diarahkan ke alamat /buku/edit/{{ $bk->idbuku}},
<form name="formbukuedit" id="formbukuedit" action="/buku/edit/{{ $bk->idbuku}} " method="post" enctype="multipart/form-data">Oleh karena itu selanjutnya kita buatkan route baru pada routes/web.php
Route::put('/buku/edit/{idbuku}', 'BukuController@bukuedit');Pada route tersebut terdapat BukuController@bukuedit, yang artinya pada controller app/Http/Controllers/BukuController.php kita buatkan methode baru yang bernama bukuedit. Kita buka kembali controller BukuController.php tersebut dan tambahkan sintak menjadi seperti berikut :
//method untuk edit data buku public function bukuedit($idbuku, Request $request) { $this->validate($request, [ 'kodebuku' => 'required', 'judul' => 'required', 'pengarang' => 'required', 'penerbit' => 'required' ]); $idbuku = BukuModel::find($idbuku); $idbuku->kodebuku = $request->kodebuku; $idbuku->judul = $request->judul; $idbuku->pengarang = $request->pengarang; $idbuku->penerbit = $request->penerbit; $idbuku->save(); return redirect()->back(); }Hasilnya seperti berikut ini :
Untuk data siswa dan petugas caranya hampir sama dengan data buku, kita tinggal copy dan modifikasi saja. Selanjutnya kita akan menampilkan, tambah, edit dan hapus (CRUD) data peminjaman. Peminjaman sedikit berbeda dengan data di atas, karena ada relasi table tbl_peminjaman dengan table lainnya.
CRUD Peminjaman
Untuk CRUD Peminjaman berikut tahapan-tahapannya :
- Perhatikan pada file menu.blade.php, di situ terdapat menu untuk link ke Data Peminjaman
<li class="nav-item"> <a class="nav-link" href="/pinjam">Data Peminjaman</a> </li>Pada sintak tersebut terdapat link yang mengarahkan ke alamat /pinjam, maka selanjutnya kita buat route baru pada file routes/web.php dengan sintak seperti berikut :
Route::get('/pinjam', 'PinjamController@pinjamtampil'); - Setelah route dibuat, disitu terdapat paramater PinjamController@pinjamtampil. PinjamController merupakan nama controller untuk manangani peminjaman, sedangkan pinjamtampil nama method di dalam controller tersebut dengan nama pinjamtampil. Selanjutnya kita buat controller tersebut pada terminal dengan perintah :
php artisan make:controller PinjamController
Dalam contoller PinjamController.php kita buatkan method dengan nama pinjamtampil, dengan sintak seperti berikut ini :
<?php namespace App\Http\Controllers; use Illuminate\Http\Request; //memanggil model PinjamModel use App\Models\PinjamModel; class PinjamController extends Controller { //method untuk tampil data peminjaman public function pinjamtampil() { $datapinjam = PinjamModel::orderby('idpinjam', 'ASC') ->paginate(5); return view('halaman/view_pinjam',['pinjam'=>$datapinjam]); } } - Pada method pinjamtampil dalam controller PinjamController.php tersebut terdapat sintak untuk memanggil model yang bernama PinjamModel, maka selanjutnya kita buat model baru dengan nama PinjamModel pada terminal dengan perintah :
php artisan make:model PinjamModel
Dalam model tersebut kita tambahkan sintak seperti berikut :
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class PinjamModel extends Model { use HasFactory; protected $table = "tbl_peminjaman"; protected $primaryKey = "idpinjam"; protected $fillable = ['idpinjam','idpetugas','idsiswa','idbuku']; //relasi ke petugas public function petugas() { return $this->belongsTo('App\Models\PetugasModel', 'idpetugas'); } //relasi ke siswa public function siswa() { return $this->belongsTo('App\Models\SiswaModel', 'idsiswa'); } //relasi ke buku public function buku() { return $this->belongsTo('App\Models\BukuModel', 'idbuku'); } }Perhatikan sintak di atas, terdapat method untuk relasi ke petugas, siswa dan buku. Relasi tersebut digunakan karena tbl_peminjaman berelasi dengan table-table tersebut dan memerlukan data dari table yang berelasi tersebut. Untuk jelasnya mengenai relasi pada Laravel menggunakan Eloquent bisa dibaca pada tutorial berikut ini https://agussuratna.net/2022/03/09/tutorial-laravel-8-relasi-database-dengan-eloquent/
- Dalam model PinjamModel.php di atas terdapat sintak untuk merelasikan ke model PetugasModel, SiswaModel dan BukuModel. Selanjutnya kita buat model untuk model yang belum ada yaitu PetugasModel dan SiswaModel, kita buatkan model tersebut pada terminal dengan perintah :
php artisan make:model PetugasModel
dan
php artisan make:model SiswaModel
Dalam model PetugasModel tambahkan sintak seperti berikut ini :
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class PetugasModel extends Model { use HasFactory; protected $table = "tbl_petugas"; protected $primaryKey = "idpetugas"; protected $fillable = ['idpetugas','namapetugas','hp']; }Dalam model SiswaModel tambahkan sintak seperti berikut ini :
<?php namespace App\Models; use Illuminate\Database\Eloquent\Factories\HasFactory; use Illuminate\Database\Eloquent\Model; class SiswaModel extends Model { use HasFactory; protected $table = "tbl_siswa"; protected $primaryKey = "idsiswa"; protected $fillable = ['idsiswa','nis','namasiswa','kelas','hp']; } - Pada method pinjamtampil dalam controller PinjamController.php terdapat sintak yang mengarahkan ke view view_pinjam.blade.php yang ada dalam folder halaman
return view('halaman/view_pinjam',['pinjam'=>$datapinjam]);Selanjutnya kita buatkan view yang bernama view_pinjam.blade.php di dalam folder resources/views/halaman dengan sintak seperti berikut :
@extends('index') @section('title', 'Buku') @section('isihalaman') <h3><center>Data Peminjaman Buku</center><h3> <h3><center>Perpustakaan SMK Negeri 1 Cimahi</center></h3> <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalPinjamTambah"> Tambah Data Peminjaman </button> <p> <table class="table table-bordered table-striped"> <thead> <tr> <td align="center">No</td> <td align="center">ID Pinjam</td> <td align="center">Nama Petugas</td> <td align="center">Nama Siswa</td> <td align="center">Judul Buku</td> <td align="center">Aksi</td> </tr> </thead> <tbody> @foreach ($pinjam as $index=>$p) <tr> <td align="center" scope="row">{{ $index + $pinjam->firstItem() }}</td> <td align="center">{{$p->idpinjam}}</td> <td>{{$p->petugas->namapetugas}}</td> <td>{{$p->siswa->namasiswa}}</td> <td>{{$p->buku->judul}}</td> <td align="center"> <button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modalPinjamEdit{{$p->idpinjam}}"> Edit </button> | <a href="pinjam/hapus/{{$p->idpinjam}}" onclick="return confirm('Yakin mau dihapus?')"> <button class="btn-danger"> Delete </button> </a> </td> </tr> @endforeach </tbody> </table> <!--awal pagination--> Halaman : {{ $pinjam->currentPage() }} <br /> Jumlah Data : {{ $pinjam->total() }} <br /> Data Per Halaman : {{ $pinjam->perPage() }} <br /> {{ $pinjam->links() }} <!--akhir pagination--> @endsectionPerhatikan sintak di atas, terdapat sintak yang menampilkan data dari table yang berelasi dengan tbl_peminjaman :
<td align="center" scope="row">{{ $index + $pinjam->firstItem() }}</td> <td align="center">{{$p->idpinjam}}</td> <td>{{$p->petugas->namapetugas}}</td> <td>{{$p->siswa->namasiswa}}</td> <td>{{$p->buku->judul}}</td>Tidak baik dan akan membingungkan jika dalam halaman peminjaman hanya ditampilkan kode dari data pada table yang berelasi dengan tbl_peminjaman, maka sebaiknya yang ditampilkan nama dari data yang terdapat dari table tersebut. Misal jika menggunakan sintak $p->idpetugas, maka yang akan tampil id dari petugas tersebut karena yang berelasi id dari table, solusinya gunakan sintak $p->petugas->namapetugas, syaratnya sintak tersebut harus direlasikan dahulu pada model PinjamModel.php.
Hasilnya seperti berikut ini :
- Selanjutnya kita buat form Tambah Data Peminjaman dimana pada view_pinjam.blade.php terdapat sintak untuk Button yang memanggil modal Bootstrap
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalPinjamTambah"> Tambah Data Peminjaman </button>Maka sekarang kita tambahkan sintak untuk membuat form tambah data peminjaman menggunakan Modal Bootstrap pada view_pinjam.blade.php, yang ditulis sebeleum sintak @endsection dengan sintak seperti berikut :
<!-- Awal Modal tambah data Peminjaman --> <div class="modal fade" id="modalPinjamTambah" tabindex="-1" role="dialog" aria-labelledby="modalPinjamTambahLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalPinjamTambahLabel">Form Input Data Peminjaman</h5> </div> <div class="modal-body"> <form name="formpinjamtambah" id="formpinjamtambah" action="/pinjam/tambah " method="post" enctype="multipart/form-data"> @csrf <div class="form-group row"> <label for="idpetugas" class="col-sm-4 col-form-label">Nama Petugas</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idpetugas" name="idpetugas" placeholder="Pilih Nama Petugas"> <option></option> @foreach($petugas as $pt) <option value="{{ $pt->idpetugas }}">{{ $pt->namapetugas }}</option> @endforeach </select> </div> </div> <p> <div class="form-group row"> <label for="idsiswa" class="col-sm-4 col-form-label">Nama Siswa</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idsiswa" name="idsiswa" placeholder="Pilih Nama Siswa"> <option></option> @foreach($siswa as $s) <option value="{{ $s->idsiswa }}">{{ $s->namasiswa }}</option> @endforeach </select> </div> </div> <p> <div class="form-group row"> <label for="idbuku" class="col-sm-4 col-form-label">Judul Buku</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idbuku" name="idbuku" placeholder="Pilih Judul Buku"> <option></option> @foreach($buku as $bk) <option value="{{ $bk->idbuku }}">{{ $bk->judul }}</option> @endforeach </select> </div> </div> <p> <div class="modal-footer"> <button type="button" name="tutup" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button> <button type="submit" name="pinjamtambah" class="btn btn-success">Tambah</button> </div> </form> </div> </div> </div> </div> <!-- Akhir Modal tambah data Peminjaman -->Perhatikan sintak di atas, karena petugas, siswa dan buku mengambil data dari table lain, maka untuk datanya diamnbil dari masing-masing table-nya, untuk mengambilnya kita menggunakan select (combo box) dan datanya diambil dari table masing-masing menggunakan @foreach, data tersebut diolah oleh model. Maka kita tambahkan sintak pada method pinjamtampil dalam controller PinjamController.php menjadi seperti berikut ini :
<?php namespace App\Http\Controllers; use App\Models\BukuModel; use App\Models\PetugasModel; use Illuminate\Http\Request; //memanggil model PinjamModel use App\Models\PinjamModel; //memanggil model PetugasModel use App\Models\PetugasModel; //memanggil model SiswaModel use App\Models\SiswaModel; //memanggil model BukuModel use App\Models\BukuModel; class PinjamController extends Controller { //method untuk tampil data peminjaman public function pinjamtampil() { $datapinjam = PinjamModel::orderby('idpinjam', 'ASC') ->paginate(5); $datapetugas = PetugasModel::all(); $datasiswa = SiswaModel::all(); $databuku = BukuModel::all(); return view('halaman/view_pinjam',['pinjam'=>$datapinjam,'petugas'=>$datapetugas,'siswa'=>$datasiswa,'buku'=>$databuku]); } } - Pada modal tambah terdapat sintak :
<form name="formpinjamtambah" id="formpinjamtambah" action="/pinjam/tambah" method="post" enctype="multipart/form-data">
form tersebut mengarahkan action ke alamat /pinjam/tambah, maka selanjutnya kita buat route baru pada routes/web.php dengan sintak seperti berikut ini :
Route::post('/pinjam/tambah','PinjamController@pinjamtambah'); - Selanjutnya pada controller PinjamController.php kita buat method baru dengan nama pinjamtambah, dengan sintak seperti berikut ini :
//method untuk tambah data peminjaman public function pinjamtambah(Request $request) { $this->validate($request, [ 'idpetugas' => 'required', 'idsiswa' => 'required', 'idbuku' => 'required' ]); PinjamModel::create([ 'idpetugas' => $request->idpetugas, 'idsiswa' => $request->idsiswa, 'idbuku' => $request->idbuku ]); return redirect('/pinjam'); } - Pada method pinjamtambah kita tidak menyertakan idpinjam, hal ini dikarenakan idpinjam merupakan auto increment yang otomatis terisi. Kita coba tambah datanya dan hasilnya data tersebut berhasil tersimpan ke dalam database, dan ditampilkan di halaman data buku :
- Pada view_pinjam.blade.php terdapat button Delete
<a href="pinjam/hapus/{{$p->idpinjam}}" onclick="return confirm('Yakin mau dihapus?')"> <button class="btn-danger"> Delete </button> </a>Selanjutnya kita buatkan route baru pada routes/web.php
Route::get('/pinjam/hapus/{idpinjam}','PinjamController@pinjamhapus');Pada route tersebut terdapat PinjamController@pinjamhapus, yang artinya pada controller app/Http/Controllers/PinjamController.php kita buatkan methode baru yang bernama pinjamhapus. Kita buka kembali controller PinjamController.php tersebut dan tambahkan sintak menjadi seperti berikut :
//method untuk hapus data peminjaman public function pinjamhapus($idpinjam) { $datapinjam=PinjamModel::find($idpinjam); $datapinjam->delete(); return redirect()->back(); }Perhatikan sintak di atas, pada method tersebut dengan parameter $idpinjam yang didapatkan dari view_pinjam.blade.php, datanya dicari berdasarkan $idpinjam menggunakan fungsi find(), setelah datanya didapat selanjutnya data tersebut dihapus menggunakan fungsi delete(), setelah dihapus diarahkan kembali ke halaman sebelumnya menggunakan fungsi return redirect()->back();. Kita coba hapus salah satu datanya dan berhasil dihapus dari database, seperti berikut :
- Pada view view_pinjam.blade.php terdapat button untuk mengedit data :
<button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#modalPinjamEdit{{$p->idpinjam}}"> Edit </button>Terdapat sintak untuk memanggil modal yang bernama #modalPinjamEdit{{$p->idpinjam}}, selanjutnya kita tambahkan sintak untuk membuat form edit dengan menggunakan Modal Bootstrap seperti berikut :
<!-- Awal Modal EDIT data Peminjaman --> <div class="modal fade" id="modalPinjamEdit{{$p->idpinjam}}" tabindex="-1" role="dialog" aria-labelledby="modalPinjamEditLabel" aria-hidden="true"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="modalPinjamEditLabel">Form Edit Data Peminjaman</h5> </div> <div class="modal-body"> <form name="formpinjamedit" id="formpinjamedit" action="/pinjam/edit/{{ $p->idpinjam}} " method="post" enctype="multipart/form-data"> @csrf {{ method_field('PUT') }} <div class="form-group row"> <label for="idpinjam" class="col-sm-4 col-form-label">ID Pinjam</label> <div class="col-sm-8"> <input type="text" class="form-control" id="idpinjam" name="idpinjam" value="{{ $p->idpinjam}}" readonly> </div> </div> <p> <div class="form-group row"> <label for="petugas" class="col-sm-4 col-form-label">Nama Petugas</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idpetugas" name="idpetugas"> @foreach ($petugas as $pt) @if ($pt->idpetugas == $p->idpetugas) <option value="{{ $pt->idpetugas }}" selected>{{ $pt->namapetugas }}</option> @else <option value="{{ $pt->idpetugas }}">{{ $pt->namapetugas }}</option> @endif @endforeach </select> </div> </div> <p> <div class="form-group row"> <label for="siswa" class="col-sm-4 col-form-label">Nama Siswa</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idsiswa" name="idsiswa"> @foreach ($siswa as $s) @if ($s->idsiswa == $p->idsiswa) <option value="{{ $s->idsiswa }}" selected>{{ $s->namasiswa }}</option> @else <option value="{{ $s->idsiswa }}">{{ $s->namasiswa }}</option> @endif @endforeach </select> </div> </div> <p> <div class="form-group row"> <label for="judul" class="col-sm-4 col-form-label">Judul Buku</label> <div class="col-sm-8"> <select type="text" class="form-control" id="idbuku" name="idbuku"> @foreach ($buku as $bk) @if ($bk->idbuku == $p->idbuku) <option value="{{ $bk->idbuku }}" selected>{{ $bk->judul }}</option> @else <option value="{{ $bk->idbuku }}">{{ $bk->judul }}</option> @endif @endforeach </select> </div> </div> <p> <div class="modal-footer"> <button type="button" name="tutup" class="btn btn-secondary" data-bs-dismiss="modal">Tutup</button> <button type="submit" name="pinjamtambah" class="btn btn-success">Edit</button> </div> </form> </div> </div> </div> </div> <!-- Akhir Modal EDIT data Peminjaman -->Dalam modalPinjamEdit tersebut terdapat form dengan action yang diarahkan ke alamat /pinjam/edit/{{ $p->idpinjam}},
<form name="formpinjamedit" id="formpinjamedit" action="/pinjam/edit/{{ $p->idpinjam}} " method="post" enctype="multipart/form-data">Oleh karena itu selanjutnya kita buatkan route baru pada routes/web.php
Route::put('/pinjam/edit/{idpinjam}', 'PinjamController@pinjamedit');Pada route tersebut terdapat PinjamController@bukuedit, yang artinya pada controller app/Http/Controllers/PinjamController.php kita buatkan methode baru yang bernama pinjamedit. Kita buka kembali controller PinjamController.php tersebut dan tambahkan sintak menjadi seperti berikut :
//method untuk edit data peminjaman public function pinjamedit($idpinjam, Request $request) { $this->validate($request, [ 'idpetugas' => 'required', 'idsiswa' => 'required', 'idbuku' => 'required' ]); $idpinjam = PinjamModel::find($idpinjam); $idpinjam->idpetugas = $request->idpetugas; $idpinjam->idsiswa = $request->idsiswa; $idpinjam->idbuku = $request->idbuku; $idpinjam->save(); return redirect()->back(); }Hasilnya seperti berikut ini :
Demikian tutorial pembuatan aplikasi perpustakaan berbasis web dengan Laravel dan Bootstrap. Aplikasi perpustakaan ini sangatlah sederhana, hanya terdapat 4 table, pada kenyataannya aplikasi untuk perpustakaan sangatlah kompleks. Tutorial ini hanyalah untuk pembelajaran saja.
Semoga bermanfaat, jika ada pertanyaan silahkan tuliskan di kolom komentar.
Be the first to comment