Dalam tutorial ini saya akan membahas tentang Cara Menambahkan data ke database dengan Laravel 8. Dimana postingan ini merupakan lanjutan dari tutorial kita sebelumnya yaitu Membuat CRUD dengan Laravel 8. Untuk kalian yang belum lihat tutorial sebelumnya, silahkan cek terlebih dahulu agar anda dapat mengikuti tutorial ini dengan lebih mudah.
Baca Juga : Cara Upload File Gambar Dengan Laravel 8
Kita akan menambahkan beberapa data ke database menggunakan fungsi yang akan kita buat, berikut data yang nantinya akan kita isi ke database :
No | Nama | Details |
---|---|---|
1 | Mi Display 34Inch | Monitor Gaming terbaik 2020 |
2 | Mi 11 | Murah berkualitas |
3 | Mi Earphones | Mi True Wireless Earphones 2S White |
Silahkan ikuti langkah-langkah dibawah ini :
- Create : Pada langkah ini kita akan mengarahkan fungsi create ke halaman form input data. Sebelumnya kita sudah membuat sebuah Controller dengan nama ProductController yang terdapat pada "app\Http\Controllers\ProductController .php", silahkan masuk dalam controller tersebut. Kemudian pergi ke public function create & masukan kode seperti dibawah ini :
public function create() { return view('details.create'); }
Return view untuk mengembalikan ke tampilan create yang terdapat pada folder Resource\View\details\create.blade.php.
<!doctype html> <html lang="en"> <head> <!-- Required meta tags --> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- Bootstrap CSS --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css" integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous"> <!-- Fonts --> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@200;400&display=swap" rel="stylesheet"> <style> body { font-family: 'Montserrat', sans-serif; } </style> <title>Hello, world!</title> </head> <body> <div class="container mt-5"> <h1 class="text-center mb-5">Tambah Produk</h1> @if(Session::has('success')) <div class="alert alert-success text-center"> {{Session::get('success')}} </div> @endif <div class="card shadow-sm"> <div class="card-body"> <form action="{{ route('product.store') }}" method="POST"> @csrf <div class="form-group"> <label>Nama</label> <input type="text" name="name" class="form-control @error('name') is-invalid @enderror" placeholder="Nama Produk"> @error('name') <span class="invalid-feedback" role="alert"> <strong>{{ $message }}</strong> </span> @enderror </div> <div class="form-group"> <label>Details</label> <textarea class="form-control @error('details') is-invalid @enderror" name="details" rows="5" placeholder="Detail produk"></textarea> @error('details') <span class="invalid-feedback" role="alert"> <strong>{{ $message }}</strong> </span> @enderror </div> <button type="submit" class="btn btn-primary float-right">Simpan</button> </form> </div> </div> </div> <!-- Optional JavaScript; choose one of the two! --> <!-- Option 1: jQuery and Bootstrap Bundle (includes Popper) --> <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"> </script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"> </script> <!-- Option 2: Separate Popper and Bootstrap JS --> <!-- <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js" integrity="sha384-9/reFTGAW83EW2RDu2S0VKaIzap3H66lZH81PoYlFhbGU+6BZp6G7niu735Sk7lN" crossorigin="anonymous"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.min.js" integrity="sha384-VHvPCCyXqtD5DqJeNxl2dtTyhF78xXNXdkwX1CZeRusQfRKp+tA7hAShOK/B/fQ2" crossorigin="anonymous"></script> --> </body> </html>
- Store : Kemudian pada langkah berikut inilah kita akan meng-eksekusi data yang di isi dari form input ke dalam database.
public function store(Request $request) { // Kode dibawah ini untuk memvalidasi data yang akan di input $validate = $request->validate([ 'name' => 'required|max:255|min:3', 'details' => 'required', ]); // Panggil model Prouct kemudian create semua request yang ada ke dalam table products Product::create($request->all()); // Kembalikan ke halaman ini lagi dan berikan pesan success "Data berhasil di tambah" return back()->with('success', 'Data berhasil di tambah'); }
- Data masuk ke table products pada database
Video Tutorial :
Social Media