Laravel 9 Implement Yajra Datatables Example Tutorial

Hi Artisan,

In this tutorial, I will show you laravel 9 yajra datatables example step by step. If you would like to see an example of how to use yajra datatables in laravel 9  applications then this Laravel 9 yajra datatables tutoiral is for you. I will help you to show an example of laravel 9 datatables example and its usecase.

If you don't know how to use yajra datatables in Laravel 9 applications and want to see an example of laravel 9 yajra datatables server site server side then you are the right place.

Did you know that, Yajra Datatables is very lightweight and provides us with quick search, pagination, ordering, sorting and etc. Datatables are basically jQuery plugins that allow you to add advanced interaction controls to your HTML tables data.

This server-side Yajra Datatables also provide ajax for data searching and getting. you can give a very quick layout for search and sorting using Datatables. You can also implement Yajra Datatables in your laravel 9 application.

In this example, we will use the default users table and show you how to render them in yajra data tables, then I simply list all users using yajra datatables. so let's follow the below step and make it done.

Table of contents

  • Download Fresh Laravel 9 App
  •  Install Yajra Datatable Package
  • Add Some Dummy Data
  • Create Route
  • Create Blade To View Datatable

 

You have to just follow some steps to implement yajra data tables in your laravel 9 application. To add datatable in our laravel app i will use Yajra Datatable Package. So let's start laravel yajra datatable tutorial from scratch.

 

yajra-data-table-laravel-9-example

Step 1: Install Laravel 9

In this step, we have to download a fresh laravel app to create step by step laravel yajra datatable example. So download it by the following the command.

composer create-project --prefer-dist laravel/laravel datatable

 

Step 2 : Install Yajra Datatable Package

Now we have to install yajra datatable package in our laravel app. So run the below command to install it.

composer require yajra/laravel-datatables-oracle

 

After that, you need to add providers and alias in the following path.

config/app.php

'providers' => [
	Yajra\DataTables\DataTablesServiceProvider::class,
]
'aliases' => [
	'DataTables' => Yajra\DataTables\Facades\DataTables::class,
]

 

Step 3:  Add Dummy Records

In this step, we need to add some dummy records to show data table. I will create a user list to show it in data table. I will use tinker to add it quickly. 

php artisan tinker
//then
factory(App\User::class, 100)->create();
//
exit

 

Step 4:  Create Route

In this step, we have to set up our route. I won't use any controller to create and show our users. I will simply return the user from the route for demo purposes. So follow the below guide to create laravel data table.

routes/web.php

//Datatable Route
Route::get('users', function(){
  return view('test');
});

Route::get('userslist', function(){
  return datatables()->of(\DB::table('users')->select('*'))
      ->make(true);
})->name('userslist');

 

Step 5: Create Blade To View Datatable

Now in this final step, we need to create a blade to view data table. So create test.blade.php and add the following code.

resources/views/test.blade.php

 

Read also : Dynamic Pie Charts Example Using Google Charts API in Laravel 7

 

Now run php artisan serve command and visit this below path then you will see the below data table like below.

 

url
http://localhost:8000/users

 

And see the preview of this laravel yajra datatable tutorial's output.

 

laravel-datatable-example

 

In this article, We have successfully installed & now know how to use and install yajra datatables in the laravel 9 Application. Hope it can help you.

 

author-image
Facebook Github
A web enthusiastic, a self-motivated full-stack software engineer from Dhaka, Bangladesh with experience in developing applications using Laravel , React and Vue js