10-Apr-2023
.
Admin
Hi guys,
In this blog i will learn you how to use datatable in laravel 6 project. Datatable provide searching, ordering and pagination automatically.
it is given a quick response data because it's used ajax and it's layout very nice therefore user often use.
Now, you can create yajra datatable using below step in laravel 6.
Step 1: Install laravel 6 Project
Bellow command used to you can install Laravel 6 project
composer create-project --prefer-dist laravel/laravel blog
Step 2: configure this database in the .env file.
After you can configure your database in .env file and change the database name, username, password in the .env file.
DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=Enter_Your_Database_Name(larave6_datatable)
DB_USERNAME=Enter_Your_Database_Username(root)
DB_PASSWORD=Enter_Your_Database_Password(root)
Step 3: Database migration
configure .env file after you can run this bellow command to migrate your databse.
php artisan migrate
Step 4: Insert dummy record
Now we will insert dummy record in "users" table using laravel tinker command.
php artisan tinker
factory(App\User::class, 100)->create();
Step 5: Install Yajra datatable package
Now, We will install yajra package using below command.
composer require yajra/laravel-datatables-oracle
Step 6: Add providers and aliases
We will add below providers and aliases in the "config/app.php" file.
'providers' => [
....
Yajra\Datatables\DatatablesServiceProvider::class,
],
'aliases' => [
....
'Datatables' => 'Yajra\Datatables\Facades\Datatables',
]
Step 7: Create Controller
Now, you can create controller file using bellow command.
php artisan make:controller DataTableController --resource
Step 8: Add method in controller
Now, you can write this code in controller file.
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\User;
class DataTableController extends Controller
{
public function index()
{
return view('datatable.list');
}
public function get()
{
return datatables()->of(User::query())->make(true);
}
}
Step 9: Add Route
Add route in your route file.
Route::get('datatable', 'DataTableController@index');
Route::get('get', 'DataTableController@get');
Step 10: Create View File
Now, we will Create view file.
resources/views/datatable/list.blade.php
<!DOCTYPE html>
<html lang="en">
<head>
<title>Laravel Datatable using Yajra Tutorial Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css" rel="stylesheet">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script>
$(function() {
$('#dataTable').DataTable({
processing: true,
serverSide: true,
ajax: '{{ url('get') }}',
columns: [
{ data: 'id', name: 'id' },
{ data: 'name', name: 'name' },
{ data: 'email', name: 'email' },
{ data: 'created_at', name: 'created_at' }
]
});
});
</script>
</head>
<body>
<div class="container">
<h2>Laravel Datatable using Yajra Tutorial Example</h2>
<table class="table table-bordered" id="dataTable">
<thead>
<tr>
<th>Id</th>
<th>Name</th>
<th>Email</th>
<th>Created</th>
</tr>
</thead>
</table>
</div>
</body>
</html>
It will help you ....
#Laravel
#Laravel 6
