Le plugin jQuery dataTables peut-il respecter les couleurs des lignes alternées après le tri/filtrage?

pour archiver ceci vous devez utiliser Base style-no stylling classesdatatable pour ce faire, retirez datatable classes de tabletag

après cela créez vos propres classes pour odd e.g myodd et evene.g myeven ) lignes.

maintenant la tâche suivante est d'appliquer ces classes aux lignes de la table sur chaque dessin de table signifie:

1. Lorsque des filtres sont appliqués

2. Quand la limite des enregistrements visibles est changée etc.

Pour ce faire datatabe fournit rowCallback() vous pouvez l'utiliser de cette façon:

 $('#myTabel').dataTable({
        "rowCallback": function( row, data, index ) {
            if(index%2 == 0){
                $(row).removeClass('myodd myeven');
                $(row).addClass('myodd');
            }else{
                $(row).removeClass('myodd myeven');
                 $(row).addClass('myeven');
            }
          }
    });

Remarque:

à éviter !importantcss rule définir css ruleodd,even lignes comme ceci:

table.dataTable tbody tr.myeven{
    background-color:#f2dede;
}
table.dataTable tbody tr.myodd{
    background-color:#bce8f1;
}

DEMO:http://jsfiddle.net/ishandemon/4za80xky/

Mon commentaire est applicable pour l' comment supprimer ou modifier les classes de lignes jQuery Datatable

les Datatables fournissent maintenant un paramètre optionnel JSON nommé comme défini pour son 1.10 + documentation.

donc, si vous voulez supprimer complètement les classes impaires Pair puis utilisez le paramètre suivant lors de l'initialisation des tables.

$('#example').dataTable( {
  "stripeClasses": [] //Empty Array.
} );

si vous voulez appliquer la classe CSS personnalisée sur chaque ligne de Datatables puis.

$('#example').dataTable( {
  "stripeClasses": ['yourRowClass']
} );

Si vous voulez appliquer plus de 1 classe css (dans l'étrange même ou de manière séquentielle) tels que ces classes se répéter à soi après chaque nième ligne est terminée, utilisez ce

$('#example').dataTable( {
  "stripeClasses": [ 'strip1', 'strip2', 'strip3' ] //This combination will repeat always 3rd row
} );

les DataTables s'appliqueront à chaque classe de façon séquentielle, en boucle au besoin.

je sais que c'est ancien, mais j'ai dû développer la solution ci-dessus. J'autorise l'utilisateur à ajuster la couleur des rayures, donc j'ai dû faire:

rowCallback: (row, data, index) => {
  const stripeColor = this.options.stripeColor;

  if (index % 2 == 0) {
    $(row).removeClass('odd-row even-row');
    $(row).addClass('odd-row');

    if (!!this.options.stripe) {
      $(row).css({ background: 'transparent' })
    }
  } else {

    $(row).removeClass('odd-row even-row');
    $(row).addClass('even-row');

    if (!!this.options.stripe) {
      $(row).css({ background: stripeColor })
    }
  }
},