If you want to give users the option to update their password securely in your Laravel application, in the tutorial we will show you step-by-step how users can set a new password by entering their old password.
Steps to update password
- Creating route
- Creating controller function
- How to create password update form
Let’s get started and understand the step-by-step process!
Steps to update password
First create a route that will handle the form where the user will enter his old password and the new password.
<?php
use Illuminate\Support\Facades\Route;
use App\Http\Controllers\crud\CrudController;
/*
|--------------------------------------------------------------------------
| Web Routes
|--------------------------------------------------------------------------
|
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider and all of them will
| be assigned to the "web" middleware group. Make something great!
|
*/
// Route::get('/', function () {
// return view('welcome');
// });
Route::get('/passwordform/{id}', [CrudController::class, 'passwordview'])->name('passwordview.data');
Route::post('/passwordupdatesubmit/{id}', [CrudController::class, 'updatepassword'])->name('passwordupdatesubmit.data');
These routes are inside the Laravel framework and use a controller called CrudController. Both routes have a password related function.
route: /passwordform/{id}
This route shows a form where the user can update their password. {id} is a dynamic parameter that represents the unique ID of the user. When the user visits the URL, the passwordUpdate method is called inside CrudController which shows the form where the user who changed their password can enter the data.
route: /passwordupdatesubmit/{id}
This route is triggered when the user submits their new password in the form. What happens is the passwordUpdate is routed through the submit method call to CrudController wherein it updates the user’s inputted password. {id} again represents the unique ID of the user which lets the system know which user’s password to update.
Controller function
Now create a controller in which you will write the code to show the password form page and update the password.
<?php
namespace App\Http\Controllers\Crud;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use App\Models\crud\CrudModel;
use Hash;
class CrudController extends Controller
{
public function passwordview($id)
{
$update_view = CrudModel::find($id);
return view('crud.pages.password', compact('update_view'));
}
public function updatepassword(request $request, $id)
{
$request->validate([
'oldpassword' => 'required|min:8',
'newpassword' => 'required|min:8',
'newconfirmpassword' => 'required|min:8|same:newpassword',
]);
$updatepassword = CrudModel::find($id);
$oldpassword = $request->input('oldpassword');
$newpassword = $request->input('newpassword');
$confirmpassword = $request->input('newconfirmpassword');
if($updatepassword)
{
$password_check = Hash::check($oldpassword, $updatepassword->password);
if($password_check)
{
$updatepassword->password = Hash::make($newpassword);
$updatepassword->update();
if($updatepassword)
{
return redirect()->route('view.data')->with('success', 'Password Has Been Successfully Updated.');
}
else
{
return redirect()->back()->with('error', 'Password Has Not Been Successfully Updated');
}
}
else
{
return redirect()->back()->with('error', 'Old Password Not Match');
}
}
}
}
Is a CrudController created in the code that handles password updating. Is controller has important methods: passwordView and updatePassword.
passwordView($id):
When user has to update password, this method is called first. This method gets our user data (e.g. current password) through a user's unique id. After that, it returns a view (crud.pages.password) where user can enter his old password and new password.
updatePassword(request $request, $id):
When user submits his password, this method is called. Is method first has data validation which is done to ensure that user's old password is correct and new password is minimum 8 characters. After that, current password is checked, if old password is correct then new password is set and saved. If everything is fine, user gets success message, else error message is displayed.
This process ensures that users can update their password safely and securely, and receive an error message if the old password is incorrect.
Password update form
@extends('crud.layout')
@section('content')
<div class="container mt-5 p-0 " style="width: 40%">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<h4>Crud Operation In Laravel - Password Update</h4>
</div>
<div class="card-body">
<form action="{{route('passwordupdatesubmit.data', ['id' => $update_view->id])}}" method="post" enctype="multipart/form-data" >
@csrf
<div class="row">
<div class="col-lg-12">
@if (session('error'))
<div class="alert alert-danger">
{{ session('error') }}
</div>
@endif
</div>
</div>
{{-- row-1 --}}
<div class="row m-2">
<div class="col-lg-12">
<input type="password" name="oldpassword" class="form-control" autocomplete="off" placeholder="Enter Old Password">
@error('oldpassword')
<div class="alert alert-danger">{{$message}}</div>
@enderror
</div>
<div class="col-lg-12 mt-3">
<input type="password" name="newpassword" class="form-control" autocomplete="off" placeholder="Enter New Password">
@error('newpassword')
<div class="alert alert-danger">{{$message}}</div>
@enderror
</div>
<div class="col-lg-12 mt-3">
<input type="password" name="newconfirmpassword" class="form-control" autocomplete="off" placeholder="Confirm Password" >
@error('newconfirmpassword')
<div class="alert alert-danger">{{$message}}</div>
@enderror
</div>
</div>
{{-- row-4 --}}
<div class="row m-2">
<div class="col-lg-12">
<button type="submit" class="submitbutton">SUBMIT</button>
<a href="{{route('view.data')}}" class="cancel_link">Cancel</a>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection
Is there a form shown in the code that gives the user the option to update his password. This form is displayed through the passwordview method, which takes 3 things from the user:
- Old password: The old password has to be entered first.
- New password: The new password that the user wants to set.
- Confirm new password: The same password has to be entered again to confirm the new password.
The form also has some validation checks. If the user entered the data incorrectly, like his old password is wrong or there is some problem with the new password, then an error message is displayed. If everything is correct, the form is submitted and the password is updated.
Is there a "SUBMIT" button at the bottom of the form, which gives the user the option to submit the password. And is there also a "Cancel" link given, by clicking on which the user can cancel the form and go to another page.