jquery datatables tri par défaut

Question

J'essaie de définir le tri par défaut de la deuxième colonne dans mon tableau de données jquery. Par défaut, elle est triée par l'indice 0. J'utilise l'option "aaSorting": [[ 1, "asc" ]] mais elle met en évidence la colonne, ce que je ne veux pas au chargement initial. Comment puis-je définir le tri par défaut d'une colonne spécifique sans que la colonne soit mise en évidence comme si aucun tri n'était effectué et que la colonne d'index 0 était utilisée.

Answer 1

Il y a plusieurs possibilités :

1. Juste après avoir initialisé les DataTables, supprimez les classes de tri sur l'élément TD dans le TBODY.

2. Désactiver les classes de tri en utilisant http://datatables.net/ref#bSortClasses . Le problème, c'est que cela désactive les classes de tri pour les demandes de tri des utilisateurs, ce qui n'est pas forcément ce que vous souhaitez.

3. Demandez à votre serveur d'afficher la table dans l'ordre de tri souhaité, et n'appliquez pas de tri par défaut à la table ( aaSorting:[] ).

Answer 2

Voici le code qui le fait...

$(document).ready(function()
{
  var oTable = $('#myTable').dataTable();

  // Sort immediately with column 2 (at position 1 in the array (base 0). More could be sorted with additional array elements
  oTable.fnSort( [ [1,'asc'] ] );

  // And to sort another column descending (at position 2 in the array (base 0).
  oTable.fnSort( [ [2,'desc'] ] );
} );

Pour que la colonne ne soit pas mise en évidence, modifiez le CSS comme suit :

table.dataTable tr.odd td.sorting_1 { background-color: transparent; }
table.dataTable tr.even td.sorting_1 { background-color: transparent; }

Answer 3

Vous pouvez utiliser la fonction fnSort, voir les détails ici :

http://datatables.net/api#fnSort

Answer 4

La meilleure option consiste à désactiver le tri et à alimenter les données avec l'ordre de tri souhaité (à partir de la base de données ou d'une autre source). Essayez d'ajouter ceci à votre 'datatable' : "bSort" : false

Answer 5

Datatables prend en charge les attributs data-* de HTML5 pour cette fonctionnalité.

Il prend en charge plusieurs colonnes dans l'ordre de tri (il est basé sur 0).

<table data-order="[[ 1, 'desc' ], [2, 'asc' ]]">
    <thead>
        <tr>
            <td>First</td>
            <td>Another column</td>
            <td>A third</td>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>z</td>
            <td>1</td>
            <td>$%^&*</td>
        </tr>
        <tr>
            <td>y</td>
            <td>2</td>
            <td>*$%^&</td>
        </tr>
    </tbody>
</table>

Maintenant, mon jQuery est simplement $('table').DataTables(); et j'obtiens mes deuxième et troisième colonnes triées en ordre desc / asc.

Voici d'autres attributs intéressants pour le <table> que je me retrouve à réutiliser :

data-page-length="-1" définira la longueur de la page sur Tous (passez 25 pour une longueur de page de 25)...

data-fixed-header="true" ... Devinez