Existe-t-il un moyen de changer dynamiquement la classe d'un seul en-tête dans slick-grid 1.4.3 ?

Question

J'ai remarqué que la dernière version de slick-grid possède un attribut 'headerCssClass' sur la colonne, ce qui fonctionnerait parfaitement, sauf que je suis limité à la version 1.4.3 de slick-grid.

Je suis en train d'étendre slick-grid afin d'ajouter une fonctionnalité de tri sur plusieurs colonnes et j'aurai besoin de définir la classe de chaque en-tête de tri en conséquence. Donc, pour réitérer la question, quelqu'un connaît-il un moyen de changer dynamiquement la classe d'un en-tête donné dans slick-grid 1.4.3 ?

Answer 1

Je pense que vous pouvez le faire avec jQuery.

Ajoutez une classe css vide avec un nom quelconque.

Vous pouvez ensuite appeler addClass et removeClass pour modifier la classe de façon dynamique.

http://api.jquery.com/addClass/

http://api.jquery.com/removeClass/

c'est-à-dire

jQuery('.my-class').addClass('new-header-class');

Answer 2

Je n'aime pas vraiment cette solution, car il n'est pas préférable d'utiliser JQuery pour modifier le slick-grid, mais voilà :

var headers = $('.slick-header-columns').get(0).children;

supprimer toute information de classe non par défaut de tous les en-têtes (c'est-à-dire, $(headers).removeClass('slick-header-column-sorted') )

itérer à travers les colonnes du slick-grid et utiliser JQuery pour ajouter une classe à l'index de la colonne voulue

var header = headers[wantedColIdx];
$(header).addClass('yourClass');