Question sur les tableaux avec en-têtes fixes et tri sur les colonnes

Bonjour,

J'utilise la technique des 2 tables + 1 div pour avoir mes en-têtes de colonnes figées et un ascenseur vertical.

Exemple :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<table id="tab1" width="910px"> <tr> <td>Colonne1</td> <td>Colonne2</td> <tr> </table> <div style="width:940px; height:300px; overflow:auto;"> <table id="tab2" width="910px"> <tr> <td>Colonne1</td> <td>Colonne2</td> <tr> </table> </div>

---

Le résultat est satisfaisant.

Je souhaite ajouter un tri sur mes colonnes.
J'ai récupéré un js qui fait ça très bien : sorttable.js (http://www.kryogenix.org/code/browse...le/#stablesort).

Le problème est que ce script ne fonctionne pas en utilisant la technique présentée ci-dessus (avec les 2 <table>)

J'ai bien trouvé une adaptation de ce script (http://www.wikistuce.info/doku.php/j...ableau_triable) mais il ne fonctionne pas très bien ...

Je suis un peu dans l'impasse :cry:

Si quelqu'un a une solution pour avoir un tableau avec en-têtes de colonnes fixes + tri je suis preneur :zoubi:

Merci

forcément il suffit de modifier le click pour que l'evènement du tableau d'entetes ait une action sur le tableau du corps ...

Hello,
renseigne-toi sur les balises <thead> et <tbody>, ça peut te donner des idées ;)

Oui, très perspicace ta réponse SpaceFrog ;)

D'ailleurs c'est ce que l'auteur du second script a tenté de faire ...
Le problème est que j'ai très peu de temps pour me lancer dans l'adaptation du premier js ... maintenant si il n'y pas d'autres solutions.

Mais plus généralement, vous faites comment pour créer ce genre de tableau (en-têtes fixes + tri sur colonnes) ?

Merci

vu que le thead n'est pas géré correctement de façon crossbrowser, la solution des deux tableaux, ou l'emulation d'un header avec des div et les spans semble la meilleurs solution...
j'ai d'ailleurs il y a quelques années déja posté sur le sujet ...

http://www.developpez.net/forums/d16...ntete-tableau/

Nous sommes d'accord SpaceFrog et je suis satisfait de la solution des 2 tableaux + div pour émuler un header.

Le problème est l'ajout du tri sur colonnes avec sorttable.js en utilisant cette technique ...

J'ai l'impression que je vais devoir adapter ce script ...

Pas d'autres solutions ?

Merci.

:roll:

si quelqu'un sonnes chez ton voisin ...
tu vas pas aller ouvrir ta porte...

Si je vais voir qui sonne chez ma voisine ... elle me le demande, elle est sous ma douche :mrgreen:

Parfois, il y a certains événements qui bousculent certains comportements ... comme quoi ^^

Sinon je n'ai rien appris de neuf mais merci quand même :)

Citation:

---

Si je vais voir qui sonne chez ma voisine

---

ce n'est pas ta voisine qui t'appelle ...
avec ton tableau c'est pareil !
c'est le header qui doit appeler les fonctions, c'est pas le corps qui va écouter ce qui se passe en haut.
Donc en effet rien de nouveau sous le soleil

Citation:

---

Envoyé par SpaceFrog

ce n'est pas ta voisine qui t'appelle ...

---

euh ... on est pas sur la même longueur d'onde :lol:

Citation:

---

Envoyé par SpaceFrog

c'est le header qui doit appeler les fonctions, c'est pas le corps qui va écouter ce qui se passe en haut.

---

Qui a dit le contraire ? mon problème (dsl d'employer ce terme ;)) est que le (très bon) script que j'ai récupéré (sorttable.js) ne fonctionne pas avec 2 tableaux (mon premier tableau est le header et le second le body) et que ça me fait suer de l'adapter pour deux raisons :

1/ Je dois terminer rapidement le développement en question ;
2/ Je ne pratique pas trop le js par manque de temps.

Par conséquent, je demandais simplement s'il n'y avait pas d'autres solutions (que l'utilisation de deux tableaux) pour concevoir un tableau avec en-tête fixe + scrollbar ... Dans ce cas, je pourrais utiliser sorttable.js pour le tri des colonnes.

vu que ton script js qui opère au tri est declenché par un click sur les entetes ... et que les solutions de mises en page ont été énumérées ci dessus...

je pense que tu devrais pouvoir en conclure que :
non il n'y a pas de methode crossbrowser pour fixer les entetes de colonne autres que les bidouilles avec soit deux tableaux soit une emulation d'enteêt de tableau avec des div span et autres
et par conséquent c'est le click sur cette entete qui declenche le tri

DONC pas d'autre possibilité que de modifier le script

Tout à fait d'accord avec toi, il faut modifier ce script... allez je te laisse 1 heure SpaceFrog pour le faire :mouarf:

réglement avant expédition
tarif 150,00 € de l'heure...
je te file mes coordonnées bancaires ?

héhé :P
ça ne sera pas la peine, j'ai adapté le script et ça a l'air de fonctionner :D

:ccool: tu vois c'est pas si long ;)