Error con DataTables
Buenos dias, estoy trabajando con la libreria DataTables en PHP, el problema que tengo es que cuando lo ejecuto en modo LOCAL funciona perfectamente, pero subo los archivos al servidor y cuando abro mi pagina ya no funciona.
Alguna sugerencia por favor.
Muchas gracias
-
Hola Mauricio Lopez cómo es que no funciona? Te muestra algún error por pantalla o consola del navegador?
Podrías subir una captura del error o link para verlo?
0 -
Hola Alejandro, adjunto captura de como se ve en local y como en el servidor. Notá que no se ve la paginación, tampoco la busqueda, me muestra los registros, pero aparentemente no carga la libreria y la estoy cargando CDN tanto en local como del lado del servidor.
0 -
Hola!
En la consola del Chrome ves algún error o advertencia? Que quizás no este bajando la libreria o no se este inicializando?
0 -
Eso es lo raro Miguel, no hay ningun error, aparentemente esta cargando todo bien, lo raro es que funcione bien en local y no en el servidor, siendo que las librerias las carga todas por CDN
0 -
En network podés ver que realmente se esten descargando las librerias de datatables y jquery?
0 -
Si, se cargan todas a la perfección.
0 -
Como inicializas el datatable? Lo asocias al evento document.ready?
0 -
Si exactamente,
$(document).ready(function () {$('#example').DataTable({"columnDefs": [{"targets": 0}],language: {"sProcessing": "Procesando...","sLengthMenu": "Mostrar _MENU_ resultados","sZeroRecords": "No se encontraron resultados","sEmptyTable": "Ningun dato disponible en esta tabla","sInfo": "Mostrando resultados _START_-_END_ de _TOTAL_","sInfoEmpty": "Mostrando resultados del 0 al 0 de un total de 0 registros","sInfoFiltered": "(filtrado de un total de _MAX_ registros)","sSearch": "Buscar ","sLoadingRecords": "Cargando...","oPaginate": {"sFirst": "Primero","sLast": "Ultimo","sNext": "Siguiente","sPrevious": "Anterior"},"iDisplayLength": 50,"processing": true,"serverSide": true,}});});0 -
Hay 2 cositas que no entiendo, usas serverSide pero no le especificas una fuente de datos para que tome y haga el filtrado y paginado por backend.Quizás venga por aca el problema, que al ser remoto no se inicializa porque no tiene fuente de datos.
Tambien la definción de columnas (columnDefs), si lo haces serverside, tenes que especificar todas o ninguna. Si no es serverside no es necesario definir nada.0 -
Perfecto Miguel, voy a trabajar en eso y te aviso. Muchas gracias por tu tiempo.
Saludos
0 -
Si tu intensión es hacerlo serverside, te dejo un ejemplo de como lo utilizo para un listado de Clientes paginado y filtrado por el backend.
Configuro todo el objeto datatable en un objeto con una función init y después de toda esa definición de la misma la ejecuto.
Tambien tengo el archivo de idioma aparte.
var assetListVM;
$(function () {
assetListVM = {
dt: null,
init: function () {
dt = $('#tablaClientes').DataTable({
"serverSide": true,
"processing": true,
"ajax": {
"url": "/Clientes/Listar",
type: 'POST'
},
"columns": [
{ "title": "Nombre o Razón Social", "data": "RazonSocial", "searchable": true },
{ "title": "Documento", "data": "Identificador", "searchable": true },
{ "title": "Email", "data": "Email", "searchable": true },
{ "title": "Dirección", "data": "Direccion", "searchable": true },
{ "title": "Localidad", "data": "Localidad", "searchable": true },
{ "title": "Codigo Postal", "data": "CodigoPostal", "searchable": true },
{ "title": "Provincia", "data": "Provincia.Nombre", "searchable": true },
],
"language": {
"url": "/Scripts/datatables/spanish.json"
},
"lengthMenu": [[10, 25, 50], [10, 25, 50]],
responsive: true,
autoWidth: false
});
}
}
assetListVM.init();
});0 -
Muchas gracias GENIO!!
0 -
Hola Miguel, estuve trabajando todo el dia en lo que me mandaste. Ahora me arroja un error del cual no puedo salir. Te adjunto el codigo y la captura del error. Te comento algo que hace cuando cambio el valor serverside a false, en local funciona perfecto, cuando lo paso a true deja de funcionar, pero en ambos casos sigue sin funcionar en el servidor.
$(document).ready(function () {$("#listaproductos").DataTable({"serverSide": true,"processing": true,"paging": true,language: {"url": "//cdn.datatables.net/plug-ins/1.10.20/i18n/Spanish.json"},ajax: {"url": "datos_productos.php","type": 'POST'},"columns": [{ "title": "ID", "data": "id_producto", "searchable": true },{ "title": "PRODUCTO", "data": "descripcion", "searchable": true },{ "title": "P.COSTO", "data": "precio_costo", "searchable": true },{ "title": "P.VENTA", "data": "precio_venta", "searchable": true },{ "title": "RUBRO", "data": "rubro", "searchable": true },{ "title": "SUCURSAL", "data": "nombre_sucursal", "searchable": true },{ "title": "IMPRESORA", "data": "impresora", "searchable": true },],"responsive": true,"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "Todos"]],"iDisplayLength": 10,"aaSorting": [[1, 'asc']],});});y con esto genero el array<?phpinclude_once('conexion.php');$database = new Connection();$db = $database->open();
$sql = "SELECT id_producto,descripcion,precio_costo,precio_venta,rubro,nombre_sucursal,impresora FROM vistaproductos";
$prep = $db->prepare($sql);$prep->execute();$result = $prep->fetchAll(PDO::FETCH_ASSOC);$totalregistros = $prep->rowCount();$registrosfiltrados=$totalregistros;
$data = [];foreach ($result as $key => $value) {$InfoData = [];foreach ($value as $key1 => $value1) {$InfoData[$key1] = $value1;}$data[] = $InfoData;}
$id=1;echo json_encode(array("draw"=>(int)$id,"recordsTotal" => $registrosfiltrados,"recordsFiltered" => $totalregistros,"data"=> $data));?>Te agradezco si me das una manito. Gracias0 -
Que error te esta dando?
Por lo que estoy viendo en el código no estas filtrando ni páginando via backend por más que le pedis los datos al back de forma dinámica. Eso puede llevar a algún compartamiento no esperado.
Por ejemplo: Si vos paginas en el backend. Cuando pasa a la página 2, el front le dice al back hace el draw número 2 y una toma de 10 elementos. Con el código que pones aca, siempre le devolves al front el draw número 1 y la cantidad de elementos va a depender de los que recuperes de la base de datos y no los 10 que espera el front.
0 -
Hice la siguiente modificacion:
$requestData = $_REQUEST;header('Content-Type: text/html; charset=utf-8');echo json_encode(array("draw" => intval($requestData['draw']),"recordsTotal" => $registrosfiltrados,"recordsFiltered" => $totalregistros,"data"=> $data), \JSON_UNESCAPED_UNICODE);?>Pero me sigue arrojando error (ver adjunto) Estoy por desistir (probe de todas las formas posible y no encuentro el error)0 -
Fijate en el network que te esta trayendo el POST para recuperar los datos del back. Por lo que veo en tu captura entiendo que tenes el display_error en E_ALL por ende desde un simple NOTICE de php te rompe la sintaxis del mensaje del back y por ende te da ese error. Te recomendaria para ese archivo puntualmente desactivarlo si es el caso de que observes que los notice y los warnings te esten rompiendo el mensaje de respuesta.
Con la modificación que hiciste logras solucionar el tema del "draw" pero la cantidad de registros que envias en data no es necesariamente la cantidad que espera recibir. En el ejemplo anterior que te di, si tenes el páginado en 10 elementos, siempre y cuando haya 10 o menos registros todo bien. Si hay más puede causar problemas.
Si el páginado serverside te esta complicado, la solución NO ideal es hacer el páginado en el navegador. Cuando termina de cargar la página convierte toda una tabla a datatable. Esta solución es mala si contiene demasiados registros.
$(document).ready(function () {
$("#listaproductos").DataTable({
});
});<table id='listaproductos'>
<thead>
<th>1</th>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
</tbody>
</table>
0
Iniciar sesión para dejar un comentario.
Comentarios
16 comentarios