Pernah nggak kamu bikin form HTML yang kelihatannya sudah benar — tombol submit sudah ada, input sudah lengkap — tapi begitu diklik, data nyasar entah ke mana? Itu bukan salah kamu, itu salah konsepnya. Di artikel ke-17 dari seri 50 Artikel Belajar Laravel ini, kita akan bedah tuntas cara membuat form di Blade template dan mengirim data ke Controller dengan benar. Topik ini erat kaitannya dengan migration Laravel karena setelah data berhasil dikirim, tujuan akhirnya ya ke tabel database yang sudah kamu buat lewat migration. Siap? Mari kita mulai dari nol!
🧩 Apa Itu Blade Template dan Kenapa Kamu Harus Pakai Ini?
Bayangkan kamu adalah seorang chef. Kamu punya resep rahasia (logika PHP), bahan-bahan segar (data dari controller), dan piring sajian yang cantik (tampilan HTML). Blade adalah piring sajian kamu — dia mengatur bagaimana data disajikan ke pengguna tanpa mengotori logika bisnis.
Blade adalah template engine bawaan Laravel yang memungkinkan kamu menulis PHP di dalam HTML dengan sintaks yang bersih dan elegan. File Blade disimpan di folder resources/views/ dengan ekstensi .blade.php.
Gunakan konvensi nama yang deskriptif. Misalnya untuk form pembuatan artikel, beri nama articles/create.blade.php. Ini memudahkan tim dan kamu sendiri saat proyek membesar.
Di dalam Blade, kamu bisa menggunakan direktif seperti @if, @foreach, @extends, dan banyak lagi. Tapi yang paling sering kamu pakai untuk form? @csrf — dan ini wajib, bukan opsional!
📝 Membuat Form HTML di Blade: Step by Step
Oke, langsung praktik. Kita akan membuat form sederhana untuk menambah data artikel. Ikuti langkah-langkah berikut:
Buat Route untuk Menampilkan Form dan Menerima Data
Buka file routes/web.php dan tambahkan dua route:
use App\Http\Controllers\ArtikelController; Route::get('/artikel/create', [ArtikelController::class, 'create']) ->name('artikel.create'); Route::post('/artikel', [ArtikelController::class, 'store']) ->name('artikel.store');
Buat Controller (Jika Belum Ada)
Jalankan perintah Artisan di terminal:
$ php artisan make:controller ArtikelController
Tambahkan Method create() di Controller
Buka app/Http/Controllers/ArtikelController.php:
public function create() { return view('artikel.create'); }
Buat File Blade untuk Form
Buat file resources/views/artikel/create.blade.php:
<!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <title>Tambah Artikel</title> </head> <body> <h1>Tambah Artikel Baru</h1> <form action="{{ route('artikel.store') }}" method="POST"> @csrf <label>Judul:</label> <input type="text" name="judul" placeholder="Tulis judul artikel"> <label>Konten:</label> <textarea name="konten"></textarea> <button type="submit">Simpan</button> </form> </body> </html>
Direktif @csrf menghasilkan hidden token yang melindungi form dari serangan Cross-Site Request Forgery. Tanpa ini, Laravel akan menolak request-mu dengan error 419 Page Expired. Jangan pernah skip!
🎯 Menerima dan Memproses Data di Controller
Setelah form dikirim, Laravel akan merutekan request ke method store() di controller. Di sinilah kamu menangkap data dan — kalau sudah ada tabel dari migration Laravel — menyimpannya ke database.
Tambahkan Method store() di Controller
use App\Models\Artikel; use Illuminate\Http\Request; public function store(Request $request) { // Ambil semua data dari form $judul = $request->input('judul'); $konten = $request->input('konten'); // Simpan ke database via Eloquent Model Artikel::create([ 'judul' => $judul, 'konten' => $konten, ]); // Redirect setelah berhasil return redirect()->route('artikel.create') ->with('sukses', 'Artikel berhasil disimpan!'); }
$request->all() mengambil SEMUA data sekaligus dalam bentuk array, termasuk CSRF token. Sedangkan $request->input('nama') lebih selektif dan aman. Untuk keamanan ekstra, gunakan $request->only(['judul','konten']) agar hanya field yang kamu izinkan yang masuk.
Pastikan Model Memiliki $fillable
Agar Artikel::create() bisa bekerja, model harus mendaftarkan kolom yang boleh diisi massal (mass assignment). Ini berhubungan langsung dengan tabel yang dibuat oleh migration Laravel.
class Artikel extends Model { protected $fillable = [ 'judul', 'konten', ]; }
🗄️ Hubungan Form dengan Migration Laravel dan Database
Nah, di sinilah semua puzzle menyatu. Ketika kamu mengirim form, data butuh "rumah" untuk ditinggali — dan rumah itu adalah tabel di database yang dibuat lewat migration Laravel. Kalau kamu belum membuat tabel, simpanan data akan gagal dan kamu dapat error seperti SQLSTATE: Base table or view not found.
php artisan make:migration create_artikels_table → file migration terbuatjudul, konten) di method up()php artisan migrate → tabel terbuat di databaseArtikel::create() menyimpan ke tabel ✅Contoh migration untuk tabel artikels yang mendukung form kita:
public function up(): void { Schema::create('artikels', function (Blueprint $table) { $table->id(); $table->string('judul'); $table->text('konten'); $table->timestamps(); }); }
Laravel secara otomatis mengonversi nama model ke nama tabel dalam format snake_case plural. Model Artikel → tabel artikels. Model BlogPost → tabel blog_posts. Kamu bisa override ini dengan properti $table di model.
📊 Referensi Cepat: Method Request yang Sering Dipakai
| Method | Kegunaan | Contoh |
|---|---|---|
| $request->input() | Ambil nilai satu field | $request->input('judul') |
| $request->all() | Ambil semua data form (array) | $data = $request->all() |
| $request->only() | Ambil field tertentu saja | $request->only(['judul']) |
| $request->except() | Ambil semua kecuali field ini | $request->except(['_token']) |
| $request->has() | Cek apakah field ada di request | $request->has('judul') |
Gunakan ->with('sukses', 'Pesan') saat redirect, lalu tampilkan di Blade dengan @if(session('sukses')) ... @endif. Ini memberikan feedback langsung ke pengguna tanpa reload penuh.
No comments:
Post a Comment