DataTables – Mostrar datos datos alamacenados localmente con JavaScript

Ayer hablé sobre almacenar datos en el cliente con HTML5 y a principios de año, también hablé sobre jStorage para almacenar datos localmente con jQuey, Mootools o Prototype.

Pero ¿Cómo mostrar los datos elegantemente y dinámicamente? Simple con DataTables.

DataTables es un plugin jQuery para agregar interacción a cualquier tabla HTML. Ordenar columnas, mostrar de a 10 filas, etc., son algunas de las opciones que ofrece este plugin Javascript.

Principales características de DataTables:

• Cantidad de items configurable.
• Filtro dinámico.
• Ordenación por una o varias columnas.
• Anchos de columnas administrados automáticamente.
• Muestra data de fuentes como: DOM, un array Javascript, un archivo Ajax además de datos procesados en el servidor como: PHP, C#, Perl, Ruby, AIR, Gear, etc.
• Soporte completo para internacionalización.
• Soporta temas (themes) de jQuery UI.

Además implementar un DataTable es tan sencillo como escribir un código Javascript como siguiente:

/*
* Example init
*/$(document).ready(function(){
$('#example').dataTable();
});

A todas las ventajas de almacenar datos en el cliente, hay qye sumar toda la potencia disponible para visualizarlos como las que ofrece DataTables.

DataTables: www.datatables.net/index

jStorage: www.jstorage.info