User Active/Inactive using Jquery

First, create Route

Route::group(['middleware' => ['auth'], 'namespace' => 'Ajax'], function () {
        Route::get('userStatus','AjaxController@userStatus')->name('auth.userStatus');

});

Create Controller for this route

  public function userStatus(Request $request)

    {

        $user = User::find($request->userId);

        $user->isActive = $request->userStatus;

        $user->save();

        return response()->json(['success'=>'user status changed succesfully']);

    }

Add jquery for this in file

• First add checkbox In this I have used the bootstrap toggle library

@foreach($users as $user)

<td>

<input

data-id="{{$user->id}}"

class="toggle-class"

type="checkbox"

data-onstyle="success"

data-offstyle="danger"

data-toggle="toggle"

data-on="Active"

data-off="Block" {{ $user->isActive ? 'checked' : '' }}

>

</td>

@endforeach

• second, add or write jquery

<script>

    $(function() {

        $('.toggle-class').change(function() {

            var userStatus = $(this).prop('checked') == true ? 1 : 0;

            var userId = $(this).data('id');

            //    console.log(userStatus);

            $.ajax({

                type: "GET",

                dataType: "json",

                url: '/userStatus',

                data: {'userStatus': userStatus, 'userId': userId},

                success: function(data){

                    // console.log(data.success)

                    //success message toaster

                    const Toast = Swal.mixin({

                        toast: true,

                        position: 'top-end',

                        showConfirmButton: false,

                        timer: 5000,

                        timerProgressBar: true,

                        onOpen: (toast) => {

                            toast.addEventListener('mouseenter', Swal.stopTimer)

                            toast.addEventListener('mouseleave', Swal.resumeTimer)

                        }

                    });

                    Toast.fire({

                        icon: 'success',

                        title: data.success

                    })

                }

            });

        })

    })

</script>

Note: Helful someone blog link: https://www.nicesnippets.com/blog/how-to-active-and-inactive-status-in-laravel-76