@matheuslao's blog

Aprendendo, testando e escrevendo para não esquecer e compartilhar.

Ordenando datas no DataTables.js

Atualmente o melhor, ou mais conhecido, ou mais usado plugin para prover funcionalidades em tabelas é o famoso DataTables.js.

Os recursos são muitos e sua utilização é bem simples. Paginação e pesquisa é uma beleza e integrar em suas tabelas é bem fácil deixando-as mais robustas para o usuário. Adicionando o recurso de escolha de ordenação pelas colunas finaliza uma configuração básica, funcional e proveitosa para seu projeto.

O problema

No entanto, a ordenação de datas não sai simplesmente com o DataTables.js básico. Se você experimentar, verá que a ordenação por colunas com Datas (e suas variações) não funciona.

Dar uma pesquisada no Novo Pai dos Burros por palavras como datatables date sorting será seu primeiro passo como bom desenvolvedor! Tem muita coisa por lá, muitas soluções, algumas gambiarras que funcionam, outras que se perdem no tempo.

A solução que utilizava era um plugin que está na própria página do DataTables.js na seção plugins/sorting. Mas o plugin em 2015 está deprecated. O que fazer agora?

O que funciona hoje

Em 18/12/2014 em um post no site do próprio site do DataTables.js, foi postado a nova maneira de ordenar colunas com datas. Bem simples e você pode conferir aqui.

Basicamente o novo plugin chamado datetime-moment é uma implementação com base no Moment.js, uma biblioteca bastante poderosa para se trabalhar com datas com javascript.

Como funciona? Como ordenar datas no Datatable.js?

Direto ao assunto então:

Primeiro, claro, adicionar as bibliotecas datetime-moment e Moment.js ao seu projeto. (seguindo boas práticas como minificando, comprimindo… :P)

Depois,

$(document).ready(function() {
  $.fn.dataTable.moment( 'DD/MM/YYYY' );
  //Existem infinitos formatos suportados! Confere no site

  $('#my-table').DataTable();
    //aqui vai a configuração normal do datatable em sua tabela
  } );

Pronto!

comments powered by Disqus