Saltar al contenido

Cómo mostrar un mensaje de datos vacíos en Datatables

Si encuentras algún error con tu código o proyecto, recuerda probar siempre en un ambiente de testing antes añadir el código al trabajo final.

Solución:

Si desea personalizar el mensaje que se muestra en la tabla vacía, use esto:

$('#example').dataTable( 
    "oLanguage": 
        "sEmptyTable":     "My Custom Message On Empty Table"
    
 );

Desde Datatable 1.10 puedes hacer lo siguiente:

$('#example').DataTable( 
    "language": 
        "emptyTable":     "My Custom Message On Empty Table"
    
 );

Para el completar tablas de datos disponibles mensajes personalizados para la tabla echa un vistazo al siguiente enlace referencia/opción/idioma

Versiones posteriores de dataTables tener lo siguiente language ajustes (tomado de aquí):

  • "infoEmpty" – se muestra cuando no hay registros en la tabla
  • "zeroRecords" – se muestra cuando no hay registros que coincidan con el filtrado

p.ej

$('#example').DataTable( 
    "language": 
        "infoEmpty": "No records available - Got it?",
    
);

Nota: Como los nombres de las propiedades no contienen ningún carácter especial, puede eliminar las comillas:

$('#example').DataTable( 
    language: 
        infoEmpty: "No records available - Got it?",
    
);

Llega tarde al juego, pero también puedes usar un archivo de localización

DataTable proporciona una .json archivo localizado, que contiene el key sEmptyTable y el mensaje localizado correspondiente.

Por ejemplo, simplemente descargue el archivo json localizado en el enlace anterior, luego inicialice su Datatable como eso :

$('#example').dataTable( 
    "language": 
        "url": "path/to/your/json/file.json"
    
);

En mi humilde opinión, eso es mucho más limpio, porque su contenido localizado se encuentra en un archivo externo.

Esta sintaxis funciona para Tablas de datos 1.10.16no probé en versiones anteriores.

Eres capaz de secundar nuestro cometido mostrando un comentario y dejando una valoración te damos las gracias.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *