Cata Membuat Fitur Change Password

Posted on 04 September 2024


Untuk membuat fitur change password di Laravel, Anda perlu mengikuti beberapa langkah. Saya akan memberikan panduan langkah-demi-langkah untuk membuat fitur ini. Panduan ini mencakup pembuatan route, controller, form, dan validasi.

Langkah 1: Menyiapkan Route

Tambahkan route untuk menampilkan formulir ganti kata sandi dan mengirim permintaan ganti kata sandi.

// routes/web.php use App\Http\Controllers\ChangePasswordController; Route::get('/change-password', [ChangePasswordController::class, 'showChangePasswordForm'])->name('password.change.form'); Route::post('/change-password', [ChangePasswordController::class, 'changePassword'])->name('password.change');


Langkah 2: Membuat Controller

Buat controller yang akan menangani logika ganti kata sandi. Anda dapat membuat controller baru dengan perintah Artisan:

php artisan make:controller ChangePasswordController

Kemudian, tambahkan metode untuk menampilkan formulir dan mengubah kata sandi.

// app/Http/Controllers/ChangePasswordController.php namespace App\Http\Controllers; use Illuminate\Http\Request; use Illuminate\Support\Facades\Hash; use Illuminate\Support\Facades\Auth; use Illuminate\Support\Facades\Validator; class ChangePasswordController extends Controller { public function showChangePasswordForm() { return view('auth.change-password'); } public function changePassword(Request $request) { $validator = Validator::make($request->all(), [ 'current_password' => 'required', 'new_password' => 'required|min:8|confirmed', ]); if ($validator->fails()) { return redirect()->route('password.change.form') ->withErrors($validator) ->withInput(); } $user = Auth::user(); // Check if the current password is correct if (!Hash::check($request->current_password, $user->password)) { return redirect()->route('password.change.form') ->withErrors(['current_password' => 'Current password is incorrect']) ->withInput(); } // Update the password $user->password = Hash::make($request->new_password); $user->save(); return redirect()->route('password.change.form')->with('status', 'Password changed successfully!'); } }

Langkah 3: Membuat Formulir Ganti Sandi 

Buat view Blade untuk formulir ganti kata sandi. Tempatkan file ini di resources/views/auth/change-password.blade.php.

@extends('layouts.app') @section('content') <section class="password-section text-center text-lg-start"> <style> /* Your CSS styles here */ </style> <div class="bg-overlay"></div> <div class="password-form"> <h2>Change Your Password</h2> <!-- Display status message --> @if(session('status')) <div class="alert alert-success alert-dismissible fade show" role="alert"> {{ session('status') }} <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> </div> @endif <!-- Display validation errors --> @if ($errors->any()) <div class="alert alert-danger alert-dismissible fade show" role="alert"> <ul> @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach </ul> <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> </div> @endif <form method="POST" action="{{ route('password.change') }}"> @csrf <!-- Current Password input --> <div class="form-outline mb-4"> <label class="form-label" for="current_password">Current Password</label> <input type="password" id="current_password" name="current_password" class="form-control @error('current_password') is-invalid @enderror" required /> @error('current_password') <div class="invalid-feedback"> {{ $message }} </div> @enderror </div> <!-- New Password input --> <div class="form-outline mb-4"> <label class="form-label" for="new_password">New Password</label> <input type="password" id="new_password" name="new_password" class="form-control @error('new_password') is-invalid @enderror" required /> @error('new_password') <div class="invalid-feedback"> {{ $message }} </div> @enderror </div> <!-- Confirm New Password input --> <div class="form-outline mb-4"> <label class="form-label" for="new_password_confirmation">Confirm New Password</label> <input type="password" id="new_password_confirmation" name="new_password_confirmation" class="form-control" required /> </div> <div class="text-center mb-4"> <a href="{{ route('password.request') }}" class="btn-link">Forgot Password?</a> </div> <!-- Submit button --> <button type="submit" class="btn btn-primary btn-block mb-4">Change Password</button> </form> </div> </section> @endsection

Kesimpulan

  1. Route: Mendefinisikan route untuk menampilkan formulir dan mengubah kata sandi.
  2. Controller: Menangani logika validasi dan pembaruan kata sandi.
  3. View: Menyediakan formulir HTML untuk input kata sandi.