Laravel Toggle Switch with Ajax Update Database

Today, We want to share with you Laravel Toggle Switch with Ajax Update.In this post we will show you Use Ajax Checkbox Toggles to Update the Database in Laravel, hear for PHP Laravel 5|6|7 Toggle switch Update DB field using jQuery Ajax we will give you demo and example for implement.In this post, we will learn about Update Model Status using Toggles in Laravel with an example.

Laravel Toggle Switch with Ajax Update

There are the Following The simple About Bootstrap3 toggles switch using Laravel 6/7 with ajax update to mysql Full Information With Example and source code.

Read Also:  Laravel Ajax Bootstrap Toggle switch Update MySQL

As I will cover this Post with live Working example to develop Bootstrap Toggleswitch with jquery ajax update to mysql in Laravel, so the Bootstrap Toggles Switch Update Database Field Using Laravel jQuery Ajax is used for this example is following below.

Step 1: Install Laravel Latest Version

laravel 5|6|7 application setup

composer create-project --prefer-dist laravel/laravel toggle-wwitch-button

Step 2: Create Routes

routes/web.php

Route::get('hospitals', '[email protected]');
Route::get('updateToggleSwitchStatus', '[email protected]');

Step 3: Create Controller

app/Http/Controllers/HospitalController.php

<!--?php namespace App\Http\Controllers; use Illuminate\Http\Request; use App\Hospital; class HospitalController extends Controller { /** * Responds with a welcome message with instructions * * @return \Illuminate\Http\Response */ public function index() { $hospitals = Hospital::get(); return view('hospitals',compact('hospitals')); } /** * Responds with a welcome message with instructions * * @return \Illuminate\Http\Response */ public function updateToggleSwitchStatus(Request $request) { $user = Hospital::find($request->user_id);<br ?--> $user->status = $request->status;
$user->save();

return response()->json(['success'=>'Status change successfully.']);
}
}

Step 4: Create View

resources/views/hospitals.blade.php

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" ></script>
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<div class="container">
<h1>Laravel Update User Status Using Toggle Button Example - pakainfo.com</h1>
@foreach($hospitals as $hospital)@endforeach
<table class="table table-bordered">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ $hospital->name }}</td>
<td>{{ $hospital->email }}</td>
<td><input class="toggle-class" type="checkbox" data-id="{{$hospital->id}}" data-onstyle="success" data-offstyle="danger" data-toggle="toggle" data-on="Active" data-off="InActive" />status ? 'checked' : '' }}></td>
</tr>
</tbody>
</table>
</div>
<script>
  $(function() {
    $('.toggle-class').change(function() {
        var status = $(this).prop('checked') == true ? 1 : 0; 
        var user_id = $(this).data('id'); 
         
        $.ajax({
            type: "GET",
            dataType: "json",
            url: '/updateToggleSwitchStatus',
            data: {'status': status, 'user_id': user_id},
            success: function(data){
              console.log(data.success)
            }
        });
    })
  })
</script>

Web Programming Tutorials Example with Demo

Read :

Read Also:  Show Multiple Checkbox Checked With Multiple Array Using Php

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Laravel – Toggles value in database with checkbox and ajax(toggle’s button in php Laravel mysql).
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

Read Also:  Laravel 5.7 Toggle switch Update DB field using Ajax

Related FAQ

Here are some more FAQ related to this Article:

  1. Read Also:  VueJS Bar and Star Rating Component and demo
  2. Read Also:  Toggle Switches Laravel, Ajax and jQuery example
  3. Read Also:  ng-app Directive with Name using Angular Example
  4. Read Also:  PHP - Array Functions Example With Demo
  5. Read Also:  Laravel 6 Bootstrap Toggle Switch With Ajax Update To Mysql
  6. Read Also:  jquery Onmouseover Onmouseout show/hide loop
  7. Read Also:  jQuery AJAX Loading Overlay Example
  8. Read Also:  Angular 6 Reactive Forms Validation Tutorial Example
  9. Read Also:  Bootstrap Toggle switch example
  10. Read Also:  How to get the sum of numbers in an array javascript?