In this tutorial we will discuss, how to call laravel controller method in jquery and javascript.
Call Controller method from jquery/javascript
We call laravel controller method in jquery by using ajax. Ajax is use for send data to controller and get response. Make a route for method and call this route in url of ajax.
Routes
Routes/web.php
<?php
Route::get('users',[UserController::class,'index'])->name('user.list');
Route::get('user-detail',[UserController::class,'detail'])->name('user.detail');
UserController
In UserController we will make methods for list all users and get data of single user by ajax.
<?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('user.index', compact('users'));
}
public function detail(Request $request){
$id = $request->id;
$user = User::find($id);
return response()->json(['status_code' => '200', 'data' => $user]);
}
}
View File
In blade view file(user/index.blade.php) we will send a ajax request for getting single user data.
<div>
@foreach($users as $user)
<div> {{ $user->name }} </div>
<div class="user_detail" data-id="{{ $user->id }}"> Show detail </div>
@endforeach
</div>
<script>
$(".user_detail").on('click', function(){
var id = $(this).attr("data-id");
$.ajax({
url: "{{ route('user.detail') }}",
data: {"id":id},
type: 'get',
success: function(result){
console.log(result)
}
});
});
</script>
