plugin de filtrage de colonnes dataTables avec balises de sélection

J’utilise datatables v1.92 avec le plugin de filtrage de colonnes v1.5.0.

LE PROBLÈME

J’ai besoin de créer drodowns pour le filtrage de colonne individuelle dont le balisage sera

Abc Def Ghi 

En effet, les valeurs provenant de la firebase database sont 1, 2, or 3 . L’étiquette affichée à l’utilisateur est Abc, Def, or Ghi

En utilisant le plugin de filtrage de colonnes, je peux créer un menu déroulant pour une colonne en utilisant

 .columnFilter({ aoColumns: [ type : 'select', values:['1', '2', '3'] ] }); 

Le problème est que le balisage de cette liste s’avère être

 1 2 3 

Donc, l’utilisateur est montré 1, 2, 3 comme étiquettes déroulantes au lieu de Abc, Def, Ghi

Ce que j’ai essayé

J’ai essayé de coder en dur la liste déroulante dans la section

du datatable, mais

 .columnFilter({ aoColumns: [ type : 'select', values:['1', '2', '3'] ] }); 

écrase la liste déroulante codée en dur. J’ai même essayé de passer null tant que paramètre pour aoColumns mais cela n’a pas fonctionné car il a simplement supprimé la liste déroulante codée en dur.

Alors, y a-t-il un moyen de créer un menu déroulant dans lequel l’atsortingbut value contiendra une valeur numérique alors que l’étiquette entre et sera textuelle?

Je ne sais pas si vous avez déjà résolu ce problème, mais si je regarde le site du plug-in dataTables, je ne vois pas comment faire ce que vous avez demandé.

Mais pour contourner le fnFilter vous pouvez créer le menu avance, puis utiliser le rappel fnFilter pour mettre à jour votre colonne avec une valeur spécifique.

Par exemple

  

 $('select').change(function(){ yourTable.fnFilter($(this).val(),colNum); // With colNum being the targeted column. }); 

Ce qui précède va alors filtrer la table en fonction de la valeur de vos balises , par exemple 1 . Mais si vous cherchez à filtrer par l’ABC inclus dans la .

 $('select').change(function(){ yourTable.fnFilter($('select option:selected').text(),colNum); }); 

J’espère que cela vous a aidé.

Si vous utilisez jquery.dataTables.columnFilter.js , l’approche suivante fonctionnera pour vous:

au lieu d’écrire:

 type : 'select', values:['1', '2', '3'] 

écrire cela:

 "type": "select", values: [{ label: "ABC", value: "1" }, { label: "DEF", value: "2" }]