Las datatables es un plugin de jQuery muy flexible que se utiliza para convertir una tabla HTML en un layout grid la mar de útil. Este plugin te permite crear tablas de datos con características como la paginación, la búsqueda instantánea, exportación y la ordenación multi columna. Además, esta soportado por Bootstrap y jQuery UI.
En este artículo, te mostraremos cómo gestionar todo el proceso del lado del servidor de las datatables con PHP.
Incluir las librerías
Antes que nada, debemos incluir la librería del plugin de jQuery para las datatables y, lógicamente, jQuery en si misma.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.12/css/jquery.dataTables.css"> <script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.js"></script>
Tabla HTML
Ahora debemos crear nuestra tabla HTML donde almacenaremos los datos
<table id="datatable_example" class="display" width="100%" cellspacing="0"> <thead> <tr> <th>Empid</th> <th>Name</th> <th>Salary</th> </tr> </thead> </table>
Llamada a data.php
Ahora debemos gestionar todas las funciones de la datatable utilizando el plugin de jQuery para las datatables. Para ello realizaremos una llamada al fichero del servidor data.php para obtener todos los datos de nuestra tabla MySQL.
$( document ).ready(function() { var table = $('#datatable_example').dataTable({ "bProcessing": true, "sAjaxSource": "data.php", "bPaginate":true, "sPaginationType":"full_numbers", "iDisplayLength": 5, "aoColumns": [ { mData: 'Empid' } , { mData: 'Name' }, { mData: 'Salary' } ] }); });
Data.php
Por último, en el fichero data.php, obtendremos todos los datos de nuestra tabla MySQL y devolveremos la información en formato JSON mediante la función json_encode.
<?php $servername = "localhost"; $username = "root"; $password = "12345"; $dbname = "demos"; $sql = "SELECT id as Empid,employee_name as Name,employee_salary as Salary FROM employee LIMIT 20"; $resultset = mysqli_query($conn, $sql) or die("database error:". mysqli_error($conn)); $data = array(); while( $rows = mysqli_fetch_assoc($resultset) ) { $data[] = $rows; } $results = array( "sEcho" => 1, "iTotalRecords" => count($data), "iTotalDisplayRecords" => count($data), "aaData"=>$data); echo json_encode($results); ?>
Fuente: phpzag.com