1

Estou experimentando o DataTables e ao ordenar a tabela que tem strings iniciando com acentos, elas aparecem no final da tabela. Como ordenar a tabela no formato português brasileiro?

inserir a descrição da imagem aqui

Como podem ver as palavras iniciando com acento aparecem no final da lista:

inserir a descrição da imagem aqui

O exemplo pode ser visto aqui: http://jsfiddle.net/HEDvf/2523/

2 Respostas 2

2

É preciso criar um algorítmo de ordenação próprio, usando a ordenação por detecção de tipos, como descrito aqui.

É preciso ter uma função que normalize a string, ou seja, remova os caractéres especiais e acentuação. Esta deverá ser usada na criação de um algorítmo de ordenação do DataTables, através da extensão do objeto $.fn.dataTableExt.oSort.

Após criado, a coluna que usará este algorítmo terá de ser especificada no objeto de inicialização do DataTables, na chave aoColumns, como visto aqui.

No seu caso, o javascript ficaria assim:

// Esta é a função que normalizará as string no momento da comparação.
// É necessário substituir aqui qualquer caracter que seja possível
// ter acentuação. Coloque apenas alguns como exemplo.
function clearString (str) {
  return str.toLowerCase()
    .replace(/[áãà]/g, 'a')
    .replace(/é/g, 'e')
    .replace(/í/g, 'i')
    .replace(/[óõô]/g, 'o')
    .replace(/[úü]/g, 'u')
    .replace(/ç/g, 'c');
}

$(document).ready(function() {
  // Aqui são criados os plugins de ordenação. O nome deve ser separado
  // por traços `-` e é necessário criar duas versões do algorítmo,
  // uma para ordenação ascendente e outra para descendente, ambas
  // com o sulfixo relativo.
  $.fn.dataTableExt.oSort['clear-string-asc'] = function (x, y) {
    return clearString(x) > clearString(y) ? 1 : -1;
  };

  $.fn.dataTableExt.oSort['clear-string-desc'] = function (x, y) {
    return clearString(x) < clearString(y) ? 1 : -1;
  };


  // Aqui, a propriedade `aoColumns` deve receber uma array com os
  // plugins de ordenação. No exemplo, a primeira coluna usará o plugin
  // `clear-string` quando o valor for do tipo string, especificado pela
  // propriedade `sType`. Caso queria manter a ordenação padrão, apenas
  // passe `null`, não deixe de preencher cada coluna da tabela, caso
  // ocorrerá contrário um erro. Como sua tabela tem 5 colunas, 5 itens
  // são passados na array.
  $('#example').dataTable({
    "sPaginationType": "full_numbers",
    'aoColumns': [
      { 'sType': 'clear-string' },
      null,
      null,
      null,
      null
    ]
  });
});

Creio que a partir daqui consiga implementar de acordo com suas necessidades. Lembre-se de complementar a função de normalização das strings.

2

Havia construído esse código com base no código que trabalha a língua persa. Simplesmente substitui caracteres com acentos por sem acentos.

jQuery.extend( jQuery.fn.dataTableExt.oSort, {
    "portugues-pre": function ( data ) {
        var a = 'a';
        var e = 'e';
        var i = 'i';
        var o = 'o';
        var u = 'u';
        var c = 'c';
        var special_letters = {
            "Á": a, "á": a, "Ã": a, "ã": a, "À": a, "à": a,
            "É": e, "é": e, "Ê": e, "ê": e,
            "Í": i, "í": i, "Î": i, "î": i,
            "Ó": o, "ó": o, "Õ": o, "õ": o, "Ô": o, "ô": o,
            "Ú": u, "ú": u, "Ü": u, "ü": u,
            "ç": c, "Ç": c
        };
        for (var val in special_letters)
           data = data.split(val).join(special_letters[val]).toLowerCase();
        return data;
    },
    "portugues-asc": function ( a, b ) {
        return ((a < b) ? -1 : ((a > b) ? 1 : 0));
    },
    "portugues-desc": function ( a, b ) {
        return ((a < b) ? 1 : ((a > b) ? -1 : 0));
    }
} );

$('.datatable').DataTable({
    "columnDefs": [{ type: 'portugues', targets: "_all" }]
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .