Bonjour,
J'ai un site de gestion de recettes. Lors de l'affichage de toutes les recettes, elles sont affichées dans des div.
Je souhaite permettre le filtre ou tri dynamique (sans rechargement de la page) sur ces recettes, sur plusieurs critères (note, type, alphabétique,...).
Pour l'instant, j'ai mis en place des dataset pour faire ces tris, mais ça me semble déjà lourd alors que je n'intègre pas encore tout :
echo '<a id='.$cle.' data-note="'.$infos['Etat'].'" data-titre="'.$infos['Titre'] .'" data-type="'.$infos['Type'] .'" class="idreponse" href="liste.php?id='.$cle.'" ....
Si je veux ajouter les ingrédients, la catégorie, etc, bof quoi.
Le tri est ensuite très basique :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
| function change_tri(cible, tri){
var alpha = [];
$('.idreponse').each(function(){
var alphaArr = [];
if (tri=="titre") alphaArr.push(this.dataset.titre);
else if (tri=="note") alphaArr.push(this.dataset.note);
else if (tri=="type") alphaArr.push(this.dataset.type);
else alphaArr.push(this.id);
alphaArr.push($(this));
alpha.push(alphaArr);
alpha.sort();
})
$('.idreponse').remove();
for(var i=0; i<alpha.length; i++){
$('.listing').append(alpha[i][1]);
}
} |
Ca, c'est fonctionnel.
Maintenant, j'aimerais votre avis sur la meilleure solution pour ce genre de cas : trier dynamiquement des éléments suivants des paramètres variés, non limité à l'id ou au texte.
- ajax vers la bdd? Ca fait une requête... et honnêtement je suis un amateur peu éclairé et je vais galéré (mais si c'est la meilleur solution, je m'y collerais, avec de l'aide si possible)
- garder les dataset? Aucune requête serveur, mais page lourde au final non?
- stockage dans un array et construction des div à partir de ça? Peut-être une bonne solution, mais j'ai du mal à visualiser, si quelqu'un a un exemple pour m'aider, merci
...
Merci pour vos réponses
Partager