Datatable
Quick Installation
{{-- <link rel="stylesheet" href="https://cdn.datatables.net/2.1.8/css/dataTables.dataTables.min.css"/> --}}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://cdn.datatables.net/2.1.8/css/dataTables.bootstrap5.css"/>
<script src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script src="https://cdn.datatables.net/2.1.8/js/dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.datatables.net/2.1.8/js/dataTables.js"></script>
<script src="https://cdn.datatables.net/2.1.8/js/dataTables.bootstrap5.js"></script>
Option 1: Install all DataTables libraries
composer require yajra/laravel-datatables:"^11"
Option 2: Install only this library
composer require yajra/laravel-datatables-oracle:"^11"
Pagina de referencia:
https://packagist.org/packages/yajra/laravel-datatables-oracle
Laravel package for handling server-side works of DataTables jQuery Plugin via AJAX option by using Eloquent ORM, Fluent Query Builder or Collection.
use Yajra\DataTables\Facades\DataTables; return DataTables::eloquent(User::query())->toJson(); return DataTables::query(DB::table('users'))->toJson(); return DataTables::collection(User::all())->toJson(); return DataTables::make(User::query())->toJson(); return DataTables::make(DB::table('users'))->toJson(); return DataTables::make(User::all())->toJson();
El controlador
public function getCategories()
{
$categories = CategoryModel::select('id','name','created_at','updated_at');
return datatables()->of($categories)->toJson();
}
Codigo javascrip
$('#category-table').DataTable({
ajax: "{{ url('admin/category/data') }}",
"language": {
"url": "https://cdn.datatables.net/plug-ins/1.10.19/i18n/Spanish.json"
},
'columns' : [
{data : 'id'},
{data : 'name'},
{data : 'created_at'},
{data : 'updated_at'}
],
columnDefs: [
{ targets : 2, render : function (data) { const fecha = new Date(data); return new Intl.DateTimeFormat('fr-FR').format(fecha); }},
{ targets : 3, render : function (data) { const fecha = new Date(data); return new Intl.DateTimeFormat('fr-FR').format(fecha); }},
],
});
Codigo Html
<table id="category-table" class="table table-striped table-bordered table-hover" style="width:100%">
<thead>
<tr>
<th style="width: 10px">#</th>
<th>Category Name</th>
<th>Created At</th>
<th>Update At</th>
</tr>
</thead>
</table>
Related Post
Modelo de datos en laravel
dagsis
Laravel
0
Migraciones en laravel
dagsis
Laravel
0
Eloquent ORM en Laravel
dagsis
Laravel
0
Laravel Lang
dagsis
Laravel
0
Trabajar con migraciones
dagsis
Laravel
0
0 Comments
Leave a comment
Recent Post
Imagen para laravel con sql se
dagsis
Docker
0
Imagen para .net 8
dagsis
Docker
0
Consultas Sql Gestion
dagsis
Bases de Datos
0