Through this laravel change status with toggle example tutorial we will show you how to change or update user status active or inactive in laravel application using bootstrap Toggle.
More then times we need to update the status active or inactive that’s the user login or unable login the dashboard. So updating status we can use jquery ajax with bootstrap toggle button to changing status in laravel.
Here we use user status active inactive with boolean datatype with 1 or 0. we have always two yes or no, enable or disabled, active and inactive etc.
Step 1: Create Routes
First you need to add two routes in your routes/web.php file, so open the web.php and add the the below route for getting user and another is change for the status.
use App\Http\Controllers\UserController;
Route::get('users', [UserController::class, 'index']);
Route::get('change-status', [UserController::class, 'changeStatus']);Step 2: Create Controller
Next, we need to create a new controller named as UserController using the following command:
php artisan make:controller UserControllerNow you can see in your app directory created a new controller, So open the app/Http/Controllers/UserController.php file and add below code on it.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\User;
class UserController extends Controller
{
public function index()
{
$users = User::get();
return view('users',compact('users'));
}
public function changeStatus(Request $request)
{
$user = User::find($request->id)->update(['status' => $request->status]);
return response()->json(['success'=>'Status changed successfully.']);
}
}Step 3: Create View
In the last step we create a new blade file named as users.blade.php blade file where we list the users and and add a status drag status bootstrap toggles and onclick jquery method to update using ajax request.
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" ></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" />
<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<style>
.pointer {
cursor:pointer;
}
</style>
</head>
<body>
<div class="container">
<h1>Laravel Change Status Using Toggle Button Example</h1>
<table class="table table-bordered">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Status</th>
</tr>
</thead>
<tbody>
@foreach($users as $user)
<tr>
<td>{{ $user->name }}</td>
<td>{{ $user->email }}</td>
<td>
<div class="form-group">
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input"
{{($user->status) ? 'checked' : ''}}
onclick="changeUserStatus(event.target, {{ $user->id }});">
<label class="custom-control-label pointer"></label>
</div>
</div>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</body>
<script>
function changeUserStatus(_this, id) {
var status = $(_this).prop('checked') == true ? 1 : 0;
let _token = $('meta[name="csrf-token"]').attr('content');
$.ajax({
url: `/change-status`,
type: 'post',
data: {
_token: _token,
id: id,
status: status
},
success: function (result) {
}
});
}
</script>
</html>Read Here: Ajax Post Request in Laravel Tutorial Easy Steps
So, today we learn how to change or update user or anything status active or inactive using bootstrap toggles. If you have any question feel free to add a comment in below.
best of luck