Search This Blog

Home » » Menghubungkan Form Laravel

Menghubungkan Form Laravel

Untuk menghubungkan data dari Form 1 ke Form 2 (atau halaman hasil) di Laravel, Anda bisa memanfaatkan Route, Controller, dan Blade View.

Berikut adalah panduan langkah demi langkah untuk membuat contoh kasus input nama dari Form 1 lalu menampilkannya menjadi "Nama saya ..." di form/halaman berikutnya.

1. Buat Route (routes/web.php)

Tambahkan dua route: satu untuk menampilkan Form 1, dan satu lagi untuk menerima data dan menampilkannya di Form 2.

<?php

use App\Http\Controllers\FormController;
use Illuminate\Support\Facades\Route;

// Menampilkan Form 1
Route::get('/form1', [FormController::class, 'index'])->name('form1');

// Menerima data dari Form 1 dan mengarahkannya ke Form 2
Route::post('/form2', [FormController::class, 'process'])->name('form2');

Route::get('/', function () {
    return view('welcome');
});

2. Buat Controller (FormController.php)

Buat controller menggunakan Artisan CLI

php artisan make:controller FormController, lalu isi kodenya seperti ini:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class FormController extends Controller
{
    // Menampilkan halaman Form 1
    public function index()
    {
        return view('form1');
    }

    // Memproses data dari Form 1 dan mengirimkannya ke Form 2
    public function process(Request $request)
    {
        // Validasi input nama (opsional tapi disarankan)
        $request->validate([
            'nama' => 'required|string|max:255',
        ]);

        $nama = $request->input('nama');

        // Kirim data nama ke view form2
        return view('form2', compact('nama'));
    }
}

3. Buat View Form 1 (resources/views/form1.blade.php)

Buat file Blade untuk form pertama yang berisi input text untuk nama.

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Form 1</title> </head> <body> <h2>Form 1: Masukkan Nama</h2> <form action="{{ route('form2') }}" method="POST"> @csrf <label for="nama">Nama:</label> <input type="text" id="nama" name="nama" required> <button type="submit">Kirim</button> </form> </body> </html>

4. Buat View Form 2 / Hasil (resources/views/form2.blade.php)

Buat file Blade kedua untuk menangkap dan menampilkan data yang dikirimkan.

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Form 2 / Hasil</title>

</head>

<body>

    <h2>Form 2: Hasil Output</h2>

    

    <!-- Menampilkan hasil input dari Form 1 -->

    <p>Nama saya <strong>{{ $nama }}</strong></p>


    <br>

    <a href="{{ route('form1') }}">Kembali ke Form 1</a>

</body>

</html>


php artisan serve

Setelah Anda menyimpannya, silakan refresh kembali halaman browser Anda ([http://127.0.0.1:8000/form1](http://127.0.0.1:8000/form1))






Penjelasan Singkat:

  1. form1.blade.php mengirimkan data menggunakan metode POST ke route form2 dengan menyertakan @csrf (keamanan wajib di Laravel).

  2. FormController menangkap data tersebut melalui parameter Request $request, lalu meneruskannya menggunakan fungsi view('form2', compact('nama')).

  3. form2.blade.php mencetak variabel $nama menggunakan sintaks Blade {{ $nama }} sehingga tampil sebagai "Nama saya [isi input]".

Penjelasan:

Secara sederhana, Route dalam Laravel (dan pengembangan web pada umumnya) berfungsi sebagai "pintu gerbang" atau "pengatur lalu lintas" yang menentukan ke mana pengguna harus diarahkan saat mereka mengakses alamat (URL) tertentu di browser.

Berikut adalah fungsi utama dari pembuatan route:

1. Menghubungkan URL dengan Logika (Controller / View)

Route bertugas mencocokkan URL yang diketik pengguna dengan fungsi atau file tampilan yang sesuai.

  • Contoh: Saat pengguna mengakses [domain.com/form1](https://domain.com/form1), route memberi tahu Laravel untuk membuka file tampilan form1.

2. Mengatur Jenis Request (HTTP Method)

Route membedakan bagaimana data dikirimkan atau diminta, seperti:

  • GET: Digunakan untuk menampilkan halaman (misal: membuka form).

  • POST: Digunakan untuk mengirim data baru ke server (misal: saat tombol submit ditekan).

  • PUT / DELETE: Digunakan untuk memperbarui atau menghapus data.

3. Mempermudah Pengelolaan URL (Named Routes)

Dengan memberikan nama pada sebuah route (contoh: ->name('form1')), kita bisa memanggil URL tersebut di dalam file Blade cukup dengan kodenya saja ({{ route('form1') }}).

  • Keuntungan: Jika suatu saat alamat URL diubah dari /form1 menjadi /halaman-pendaftaran, Anda tidak perlu mengubah link di seluruh file project satu per satu.

4. Menjaga Keamanan (Middleware)

Route memungkinkan kita memasang pengaman (middleware). Kita bisa mengatur agar sebuah route hanya bisa diakses oleh pengguna yang sudah login (terotentikasi) atau memblokir akses yang tidak sah.

Analogi Sederhana: Bayangkan Route seperti resepsionis di sebuah gedung. Ketika seorang tamu (pengguna) datang menanyakan alamat ruangan tertentu (URL), resepsionis bertugas mengecek tujuannya dan mengarahkannya ke ruangan yang benar (Controller atau View).

Secara sederhana, Controller dalam Laravel berfungsi sebagai "otak" atau pusat pengolah logika dari sebuah aplikasi.

Jika Route bertugas sebagai pintu gerbang (menentukan URL), maka Controller adalah tempat Anda menuliskan instruksi apa yang harus dikerjakan oleh aplikasi ketika pintu tersebut dibuka.

Berikut adalah fungsi utama dari pembuatan Controller:

1. Memisahkan Logika Program (Separation of Concerns)

Tanpa Controller, semua kode pemrograman (seperti logika database, validasi, dan pengolahan data) harus ditulis langsung di dalam file routes/web.php. Hal ini akan membuat file route menjadi sangat panjang, berantakan, dan sulit dirawat. Dengan Controller, kode menjadi rapi karena dipisah ke dalam file khusus.

2. Memproses Data dari Pengguna (Request & Validation)

Controller bertugas menangkap data yang dikirimkan oleh pengguna melalui form (seperti input nama yang kita buat sebelumnya), lalu memprosesnya. Anda juga bisa melakukan validasi data di sini untuk memastikan input dari pengguna sudah benar dan aman sebelum diolah lebih lanjut.

3. Menghubungkan Database dengan Tampilan (Model & View)

Controller bertugas sebagai jembatan:

  • Mengambil data dari database (melalui Model).

  • Mengolah data tersebut jika diperlukan.

  • Mengirimkannya ke halaman tampilan (View) agar bisa dibaca oleh pengguna.

Analogi Sederhana di Restoran:

  • Route adalah Pelayan yang menerima pesanan Anda di meja (mengarahkan URL).

  • Controller adalah Koki di dapur yang mengolah bahan-bahan mentah menjadi makanan yang siap saji sesuai pesanan.

  • View adalah Piring/Makanan yang akhirnya disajikan kembali ke hadapan Anda.

Studi Kasus 2:




FormControllerLatih2:

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class FormControllerLatih2 extends Controller
{
    // Menampilkan halaman Form 1
    public function index()
    {
        return view('formhitung');
    }

    // Memproses data dari Form 1 dan mengirimkannya ke Form 2
    public function process(Request $request)
    {
   
        $nama = $request->input('nama');
        $nilai1 = $request->input('nilai1');
        $nilai2 = $request->input('nilai2');
       // Lakukan proses perhitungan (Contoh: Penjumlahan)
        // Anda bisa ubah operatornya menjadi +, -, *, atau /
        $hasil = ($nilai1 + $nilai2)/2;

        if ($hasil > 80) {
            $ket = "A";
        } else  if ($hasil > 60) {
            $ket = "B";

        } else  if ($hasil > 40) {
            $ket = "C";

        } else  if ($hasil > 20) {
            $ket = "D";

        } else {
            $ket = "E";
   
        }

        // Kirim data nama ke view form2
        return view('formhasil', compact('nama', 'nilai1', 'nilai2', 'hasil', 'ket'));
    }
}

Web:

<?php

use App\Http\Controllers\FormControllerLatih2;
use Illuminate\Support\Facades\Route;

// Menampilkan Form 1
Route::get('/formhitung', [FormControllerLatih2::class, 'index'])->name('formhitung');

// Menerima data dari Form 1 dan mengarahkannya ke Form 2
Route::post('/formhasil', [FormControllerLatih2::class, 'process'])->name('formhasil');

Route::get('/', function () {
    return view('welcome');
});

FormHitung.Blade.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Form Hitung</title>
</head>
<body>
    <h2>Form Hitung: Masukkan Nilai</h2>

    <form action="{{ route('formhasil') }}" method="POST">
        @csrf
        <label for="nama">Nama:</label>
        <input type="text" id="nama" name="nama" required>
        <label for="nilai1">Nilai 1:</label>
        <input type="number" id="nilai1" name="nilai1" required>
        <label for="nilai2">Nilai 2:</label>
        <input type="number" id="nilai2" name="nilai2" required>
        <button type="submit">Kirim</button>
    </form>
</body>
</html>
FormHasil.Blade.php
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Form Hasil</title>
</head>
<body>
    <h2>Form Hasil: Hasil Output</h2>
   
    <!-- Menampilkan hasil input dari Form 1 -->
    <p>Nama saya <strong>{{ $nama }}</strong></p>
    <p>Nilai 1: <strong>{{ $nilai1 }}</strong></p>
    <p>Nilai 2: <strong>{{ $nilai2 }}</strong></p>
    <p> Hasil Penjumlahan: <strong>{{ $hasil }}</strong></p>
    <p> Keterangan: <strong>{{ $ket }}</strong></p>

    <br>
    <a href="{{ route('formhitung') }}">Kembali ke Form Hitung</a>
</body>
</html>




Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Creating Website
Comments
0 Comments

0 komentar:

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2012. Bahan Ajar - All Rights Reserved
Template Modify by Agung Baitul H (0898-1983-200)
Proudly powered by Blogger E-Mail agung.abl@bsi.ac.id