JavaScript - Meme largeur de colonne pour deux tables

JavaScript - Meme largeur de colonne pour deux tables - HTML/CSS - Programmation

Marsh Posté le 20-06-2008 à 06:04:51    

Bonjour,
A cause de la facon dont internet explorer reagi au overflow et position:relative sur div et tbody j'aurai besoin de savoir si il est possible de faire 2 tables (meme nombre de colonne) dont les largeur correspondraient (dynamiquement).
Merci de vos reponse.


Message édité par Toinou87 le 23-06-2008 à 08:41:31

---------------
Toinou87 ;-p May the force be with you!!
Reply

Marsh Posté le 20-06-2008 à 06:04:51   

Reply

Marsh Posté le 20-06-2008 à 08:17:50    

oui, en javascript  
 
mais est ce que tu es sur que les tableaux correspodnent a l'usage que tu veux en faire , et que des des div ne seraient pas plus adaptée ?


---------------

Reply

Marsh Posté le 20-06-2008 à 09:07:22    

en gros je veux afficher une table sur ma page. L'utilisateur de l'appli web veut deux choses:
scroller toute la table en horizontal pour toujours voir les filtres qu'il peut appliquer sur les données (ces filtres sont en haut de la page et la table est large donc si on scroll la fenetre, on ne voit plus les filtres)
scroller le corps de la table en vertical pour voir les filtres et voir l'entete de la table a tout moment (les noms des champs)
 
j'ai fait qqc dans ce genre:
 
<div width="x px" height="y px" style.overflow=auto>
<table>
<thead>
...
</thead>
<tbody width="x2 px" height="y2 px" style.overflow=auto>
...
</tbody>
</table>
</div>
 
Ce qui marche tres bien sous FF mais pas sous IE (il connait pas le tbody overflow)
j'ai trouvé un javascript pour freezer le header qui en gros repositionne les champs du header relativement au div dans lequel il se trouve. Le probleme c'est encore IE.
Ca marche dans FF mais pour faire simple ca plante a cause du premier overflow dans IE (les champs du header ne scroll pas horizontalement dans IE)
 
Donc ce que voudrai faire avec les deux tables ayant les memes largeur de colonne c'est:
 
<div width="x px" height="y px" style.overflow=auto>
<table> //mon ancien thead
...
</table>
<div width="x2 px" height="y2 px" style.overflow=auto>
<table>//mon ancien tbody
...
</table>
</div>
</div>
 
Tu sais comment faire en javascript? ou autrement tu sais ou je peux trouver un tuto? parce que je suis sur que ca marchera alors que ca fait 3 jours que j'essaye plein de moyens


---------------
Toinou87 ;-p May the force be with you!!
Reply

Marsh Posté le 23-06-2008 à 03:56:25    

Quelqu'un pourrait me dire comment on fait ca en javascript ou m'indiquer un site ou on le fait? J'ai cherché et rien trouvé de convainquant?
Merci d'avance


---------------
Toinou87 ;-p May the force be with you!!
Reply

Marsh Posté le 24-06-2008 à 19:41:51    

tu peux essayer en mettant :

<table>
  <tbody>
    <tr><td>colonne 1</td><td>colonne 2</td></tr>
  </tbody>
  <tbody style="overflow: auto; height: 200px;">
    <tr><td>ligne 1, colonne 1</td><td>ligne 1, colonne 2</td></tr>
    <tr><td>ligne 2, colonne 1</td><td>ligne 2, colonne 2</td></tr>
  </tbody>
</table>


Message édité par phenxdesign le 24-06-2008 à 19:42:14
Reply

Marsh Posté le 26-06-2008 à 16:29:27    

comme je l'ai dit dans mon premier post, le overflow n'est pas supporte par IE sur le tbody. ca marche tres bien sur FF par contre, je sais.
C'est pour ca que je cherche a le faire avec deux tables au lieu d'une, car je mettrai la 2e table dans un div overflow


---------------
Toinou87 ;-p May the force be with you!!
Reply

Marsh Posté le 26-06-2008 à 16:47:29    

IE gache toujours tout ! :( Chaque jour j'hallucine à propos de IE et sa capacité à ralentir le développement et la modernisation du code.
Fais avec des tailles de colonnes fixes pour que ça reste toujours aligné, je vois pas trop d'autre moyen


Message édité par phenxdesign le 26-06-2008 à 16:47:47
Reply

Marsh Posté le 27-06-2008 à 08:45:06    

bah justement, javascript apparement.
J'ai cru comprendre qu'on pouvait faire qqc du genre:
 
sur la premiere table
    pour chaque colonne
        si la largeur de colonne est plus petite que la largeur de colonne dans la table suivante, on l'augmente
sur la deuxieme table
    pour chaque colonne si la largeur de colonne est plus petite que la largeur de colonne de la table precedente, on l'augment
 
en gros dans chacune des tables, on augmente les colonnes trop petites
 
donc j'ai l'algo mais je sais pas l'implementer.
(j'ai besoin d'avoir des largeurs dynamiques pour l'utilisateur)
J'attends toujours de l'aide


---------------
Toinou87 ;-p May the force be with you!!
Reply

Marsh Posté le 27-06-2008 à 09:39:43    

Essaie en utilisant la librairie Prototype ou Mootools
http://joomlicious.com/mootable/
Avec Prototype, tu peux recuperer la taille des elements de la DOM (surement avec Mootools aussi, mais j'ai pas essayé) et tu peux donc les appliquer à d'autres elements. Le tout, c'est de savoir quand appliquer ces largeurs (il faut attendre que le contenu du tableau soit tout chargé). je pense que au onload du body doit suffire, et ensuite, si tu changes le contenu dynamiquement il faut le refaire

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed