Datatable is a powerful jQuery plugin. it is basically used to display data in a table format with various features like searching, sorting, pagination etc. In Laravel. it also provide some other features like CSV, Excel format sheet etc. if you want to Install the DataTables you need to follow below steps –
1. Install package via composer. you need to run the following command in your terminal:
composer require yajra/laravel-datatables-oracle
2. After installed the package, you need to open file and add the service provider to your config/app.php file:
'providers' => [
// ...
Yajra\DataTables\DataTablesServiceProvider::class,
],
'aliases' => [
//...
'DataTables' => Yajra\DataTables\Facades\DataTables::class,
]
3. Next, you need to publish the configuration file for DataTables:
php artisan vendor:publish --tag=datatables
4. After configuration file published, then you have completed installation things you will have succussfully installed package of datatables.
5. Now, you can create a new controller like users that will handle the data and return it to the view. you can use the following example code as a learning point. I have created UserController under app\Http\Controllers and put below code.
UserController.php
<?php
namespace App\Http\Controllers;
use App\Models\User;
use DataTables;
class UserController extends Controller
{
public function index()
{
return view('users.index');
}
public function getUsersList()
{
$users = User::orderBy('id','DESC')->get();
return DataTables::of($users)
->rawColumns(['status'])
->make(true);
}
public function show()
{
}
}
6. Default laravel controller method index return the view that will contain the DataTable. In this example, we are returning a view called users.index.
7. In the getUsersList method of the controller, fetch the data from the database and return it to DataTables. We are using the of method to specify the data source and the make method to generate the response that will be sent back to the DataTable.
8. I have created new view file under users folder .
users/index.blade.php
@extends('layouts.app')
<!-- you can set as per your configuration -->
@section('content')
<div class="container mt-3">
<div class="row ">
<div class="col-lg-12 margin-tb">
<div class="pull-left">
<h2>Users Management</h2>
</div>
<div class="pull-right">
</div>
</div>
</div>
<table id="users" class="table">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Created At</th>
<th>Updated At</th>
</tr>
</thead>
</table>
</div>
@endsection
@section('styles')
<!-- Custom styles for this page -->
<link href="{{ asset('js/datatables/dataTables.bootstrap4.min.css') }}" rel="stylesheet">
@endsection
@section('scripts')
<!-- you can set js/css as per your folder configuration-->
<script src="{{ asset('js/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('js/datatables/dataTables.bootstrap4.min.js') }}"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#users').DataTable({
processing: true,
serverSide: true,
ajax: {
url: "{{ route('users.getUsersList') }}",
method: 'POST'
},
lengthMenu: [
[10, 25, 50, 100, -1],
[10, 25, 50,100,"All"]
],
columns: [
{data: 'id', name: 'id'},
{data: 'name', name: 'name'},
{data: 'email', name: 'email'},
{data: 'created_at', name: 'created_at'},
{data: 'updated_at', name: 'updated_at'},
],
order: [[1, 'asc']]
});
});
</script>
@endsection
9. create route for users section.
routes/web.php
Route::resource('users', App\Http\Controllers\UserController::class);
Route::post('users/getUsersList', [App\Http\Controllers\UserController::class, 'getUsersList'])->name('users.getUsersList');
10. if you want to add menu in header then open resources\views\layouts\app.blade.php and add below menu code.
<li class="nav-item">
<a class="nav-link" href="{{ route('users.index') }}">{{ __('Users') }}</a>
</li>
now you can run users like http://localhost/Laravel_installation/users then it will show datatable also with header menu.
Hello, Welcome to webdeveloperindia.in. I am a full-stack web developer. Email – [email protected] | Skype – azaruddin23. I have knowledge of PHP, Laravel, Magento 1/2, Codeigniter, WordPress, Joomla, Shopify, Git, Bitbuket, jQuery, Ajax, Javascript and ReactJS.