Lompat ke konten Lompat ke sidebar Lompat ke footer

Belajar Laravel CRUD Sesi 3 Read Data dari Database

Laravel CRUD Read

Belajar Laravel CRUD Read Data - Pada artikel sebelumnya, kita telah membuat database, tabel, dan rute. Sekarang kita akan mencoba menampilkan data di database.

Jika kita mempelajari CRUD, hal pertama yang dibuat dengan nama "CRUD" adalah Create atau cara membuat data di database. Namun untuk memudahkan kita sebagai pemula, kita akan belajar langsung cara membaca data (Read) dari database, nanti kita akan belajar cara membuat/memasukkan data ke database.

Untuk itu, pertama-tama kita memasukkan beberapa data ke dalam database secara manual. Buka kembali phpmyadmin -> crud -> testingname -> Insert -> masukkan beberapa data ke dalam database, maka akan terlihat seperti pada gambar berikut:

Laravel CRUD Read Data dari Database

Karena website yang kita buat terhubung dengan database mentah di tabel testingname, kita buat modelnya terlebih dahulu. Kami akan memberi nama model "Crud". Nanti file modelnya akan diberi nama "Crud.php".

Buka terminal kemudian masih di folder "Learn Laravel -> crud", jalankan perintah berikut:

php artisan make:model Crud

* Huruf pertama dari nama model adalah huruf kapital, jadi namanya "Crud" bukan "crud".

Setelah model Crud dibuat, buka model Crud, lokasinya ada di app -> Models -> Crud.php, kemudian pada model Crud kita mendeklarasikan properti bernama $table dengan nama tabel "testingname":

protected $table = 'testingname';

Ini digunakan untuk memberitahu Laravel bahwa kita akan menggunakan tabel testingname yang ada di database "crud" yang kita buat sebelumnya. Kemudian simpan file modelnya maka akan terlihat seperti pada gambar berikut:

Laravel CRUD Read Data dari Database

Modelnya oke. Sekarang kita akan memanggil model Crud ini di controller, buka kembali CrudtestController di folder app -> Http -> Controlles. Kemudian tambahkan baris program berikut::

$data_crud = \App\Models\Crud::all();

$data_crud akan menampung semua data dalam database. Data yang disimpan dalam $data harus dilempar ke View agar dapat dilihat.

Karena halaman indeks kami bernama "crudpage", kami akan meneruskan data $data_crud ke crudpage. Cara menggunakan baris program berikut::

return view('crudpage',['data_crud' => $data_crud]);
Laravel CRUD Read Data dari Database

Buka file crudpage di folder resources -> views -> crudpage.blade.php. lalu kita cek dulu, apakah data sheet dari file controller sudah diterima oleh file crudpage atau belum dengan menambahkan fungsi bernama dd:

 {{dd($data_crud)}}

Kami menempatkan kode di dalam <body>. Misalnya saya meletakkannya di bawah <h1> seperti yang ditunjukkan pada gambar berikut:

Laravel CRUD Read Data dari Database

Jika langkah-langkah yang kami lakukan di atas sudah benar, maka Anda akan melihat hasilnya sebagai berikut:

Laravel CRUD Read Data dari Database

Ketika web browser muncul seperti di atas, berarti data yang dilempar dari controller dapat ditangkap namun masih dalam bentuk array, sedangkan untuk yang ditampilkan kita harus menampilkan data secara teratur.

Untuk itu kita perlu mengambil data satu persatu dengan metode foreach. Ganti kode program {{dd($data_crud)}} dengan program berikut:

@foreach($data_crud as $crud)
   {{$crud->full_name}}
   {{$crud->gender}}
   {{$crud->address}}
@endforeach

kemudian kode tersebut dimasukkan ke dalam struktur tabel:

<table>
        <tr>
            <th>Name</th>
            <th>Gender</th>
            <th>Address</th>
        </tr>
   
        
        <tr>
            <td>{{$crud->full_name}}</td>
            <td>{{$crud->gender}}</td>
            <td>{{$crud->address}}</td>
        </tr>
          
   </table>

sehingga pada file crudpage akan menjadi seperti ini:

Laravel CRUD Read Data dari Database

Muat ulang halaman di browser web dan muncul seperti ini:

Laravel CRUD Read Data dari Database

Jika muncul seperti itu, berarti program dadih yang kita buat telah berhasil. Namun tampilannya masih kurang bagus, Pada tutorial selanjutnya akan kita perbaiki dengan menambahkan style.

Kita akan menggunakan sedikit gaya. Silakan salin baris css berikut dan letakkan setelah </head> di file crudpage.blade.php:

<style>
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}
</style>

Secara keseluruhan program crudpage akan terlihat seperti ini:

Laravel CRUD Read Data dari Database

Maka hasilnya adalah sebagai berikut:

Laravel CRUD Read Data dari DatabaseSampai disini kita telah membuat salah satu metode CRUD yaitu Read database. Selanjutnya kita akan belajar Cara Membuat atau memasukkan data baru ke dalam database.

Posting Komentar untuk "Belajar Laravel CRUD Sesi 3 Read Data dari Database"