ahmadajah03 Sun Nov 2020 1 year ago

Cara Mengatur Formulir Pendaftaran Multi Langkah di Laravel

Pada artikel ini, saya akan menyiapkan pendaftaran dua langkah di Laravel. Anda dapat menambahkan lebih banyak langkah seperti ini. Jadi, mari kita mulai:

Langkah 1 Buat Proyek Laravel

Setiap proyek Laravel membutuhkan hal ini. Itu sebabnya saya menulis artikel tentang topik ini. Silakan lihat bagian ini dari sini: Instal Laravel dan Konfigurasi Dasar.

Langkah 2 Migrasi Database

Pada langkah 2, saya akan menampilkan 2 bidang. Yang satu adalah gender dan yang lainnya adalah biography. Jadi, kita perlu menambahkan 2 field ke tabel users . Buka database/migration dan buka file timestamp_create_users_table.php . Kemudian perbarui up() fungsinya:

public function up()
{
    Schema::create('users', function (Blueprint $table) {
        $table->id();
        $table->string('name');
        $table->string('email')->unique();
        $table->timestamp('email_verified_at')->nullable();
        $table->string('password');
        $table->string('gender', 10)->nullable();
        $table->longText('biography')->nullable();
        $table->rememberToken();
        $table->timestamps();
    });
}

Kemudian migrasikan migrasi dengan fresly:

php artisan migrate:fresh

Setelah itu, navigasikan ke folder app, buka User.php dan perbarui $fillablearray:

protected $fillable = [
    'name', 'email', 'password', 'gender', 'biography'
];

Langkah 3 Buat Controller

Kita harus membuat controller untuk mengontrol formulir langkah 2.

php artisan make:controller Auth\RegisterControllerStep2

Kemudian buka controller dari folder app\Http\Controllers\Auth dan tempel kode ini:

RegisterControllerStep2.php

<?php

namespace App\Http\Controllers\Auth;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;

class RegisterControllerStep2 extends Controller
{
    public function __construct()
    {
        $this->middleware('auth');
    }

    public function form()
    {
        return view('auth.register_step2');
    }

    public function saveData(Request $request)
    {
        auth()->user()->update($request->only(['gender', 'biography']));

        return redirect()->route('home');
    }
}

Langkah 4 Buat File View

Masuk ke folder resources/view/auth dan buat file bernama register_step2.blade.php.

@extends('layouts.app')

@section('content')
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8">
                <div class="card">
                    <div class="card-header">{{ __('Register Step 2') }}</div>

                    <div class="card-body">
                        <form method="POST" action="{{ route('register.step2') }}">
                            @csrf

                            <div class="form-group row">
                                <label for="name" class="col-md-4 col-form-label text-md-right">{{ __('Gender') }}</label>

                                <div class="col-md-6">
                                    <select name="gender" class="form-control @error('gender') is-invalid @enderror">
                                        <option value="">-- {{ __('choose') }} --</option>
                                        <option value="male">Male</option>
                                        <option value="female">Female</option>
                                    </select>

                                    @error('gender')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-group row">
                                <label for="name" class="col-md-4 col-form-label text-md-right">{{ __('Biography') }}</label>

                                <div class="col-md-6">
                                    <textarea class="form-control @error('biography') is-invalid @enderror" name="biography">{{ old('biography') }}</textarea>

                                    @error('biography')
                                    <span class="invalid-feedback" role="alert">
                                        <strong>{{ $message }}</strong>
                                    </span>
                                    @enderror
                                </div>
                            </div>

                            <div class="form-group row mb-0">
                                <div class="col-md-6 offset-md-4">
                                    <button type="submit" class="btn btn-primary">
                                        {{ __('Submit') }}
                                    </button>
                                    <br /><br />
                                    <a href="{{ route('home') }}">Skip for now</a>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

Langkah 5 Tentukan Route

Mari tentukan route untuk formulir langkah 2 dan untuk menyimpan data langkah 2:

routes/web.php

Route::get('register-step2', 'Auth\RegisterControllerStep2@form');
Route::post('register-step2', 'Auth\RegisterControllerStep2@saveData')->name('register.step2');

Hal terakhir: buka RegisterController dari dan perbarui nilai $redirectTovariabel.

protected $redirectTo = '/register-step2';

Langkah Terakhir Jalankan dan Uji

Sekarang jalankan proyek, pergi ke route register dan periksa. Berikut adalah tangkapan layar dua langkah.

Step 1:

Step 2:

 That’s it. Thanks for reading. 🙂

laravel register multi step laravel