Faire defiler deux listes avec une scroll bar

bonjour,

J'ai deux listes contenant des informations provenant d'une meme table de deux champs différents. Je souhaiterais par l'intermediaire de la scroll bar de la premiere liste faire defiler les deux listes simultanement ...! Est ce possible a votre avis ? Dans le meme temps je desire ne plus faire apparaitre la deuxieme scroll bar (mais ce n'est pas necessaire) pour que l'utilisateur n'utilise que la premiere.

Merci pour votre aide.

ben je ne sais pas quel evènement utilser pour capter le "scrollTop" du select ... entre quotes car le select ne possède pas cette propriété ...

Ton select à un size ?

sinon faut simuler le select avec des li ... ???

J'ai fait quelques recherches et j'ai trouve une solution pour lier deux scrollbar avec des div . Par contre, comme je substitue mes balises SELECT par des DIV, je voudrais conserver les actions que je réalise sur les SELECT. Je voudrais notamment récuperer la valeur selectionnée dans mon DIV (est ce possible de selectionner un élément et de retourner la valeur ?) et conserver la valeur selectionnée (simuler le SELECTED du SELECT)

Voici mon code avec le SELECT :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19

<TD> <SELECT NAME="lst_arret" OnChange='this.form.submit();' VALUE = Array SIZE=27 CLASS='listArret'> <OPTION VALUE="- - ">- - </OPTION> <OPTION VALUE="SNI1 ">4 MAISONS </OPTION> <OPTION VALUE="SCA1 ">4 MAISONS </OPTION> <OPTION VALUE="BEA1 ">8 MAI </OPTION> <OPTION VALUE="ACH1 " SELECTED>ACHARD </OPTION> </SELECT> </TD>   <TD> <SELECT NAME="lst_ArretInter" VALUE = Array SIZE=27 CLASS='listArretInter'> <OPTION VALUE="- - ">- - </OPTION> <OPTION VALUE="1 ">1 </OPTION> <OPTION VALUE="0 ">0 </OPTION> <OPTION VALUE="0 ">0 </OPTION> <OPTION VALUE="5 ">5 </OPTION> </SELECT> </TD>

---

Voici mon nouveau code avec le DIV :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18

<td> <div id='div1' style="height:80px;overflow:auto;cursor:pointer;" onscroll="document.getElementById('div2').scrollTop=this.scrollTop;" onClick="this.text.value;"> <script type='text.javascript'> for(i=0; i< xx;i++){ document.write("liste des valeurs de mon premier select") } </script> </div> </td> <td> <div id='div2' style="height:80px;overflow:hidden;" onscroll="document.getElementById('div1').scrollTop=this.scrollTop;"> <script type='text.javascript'> for(i=0; i<xx;i++){ document.write("liste des valeurs de mon deuxieme select") } </script> </div> </td>

---

Merci pour votre aide, je peux fournir d'autres explications si je n'ai pas été assez clair.

oui
avec des variables lors de la selection stockes dans une variable un selectedIndex perso ...

moi j'ai la tête bancale du matin et j'ai compris que tu souhaitez ça :
http://7up.free.fr/syn.htm

mais bon....

selects... ou emulation de select ...

hum... dois je utiliser un évènement du type Onclick pour sélectionner l'élément ?

J'ai finalement trouvé une solution simple pour ce que ca interesse. J'ai mis mes select dans les div. J'ai donné une taille suffisante de mes div pour faire apparaitre un certain nombre d'element du tableau et j'ai supprimé le scrollbar de mes select en paramettrant le size au nombre total d'elements du tableau . Le scrollbar de mon div fait en fait defiler le tableau lui meme et non son contenu. J'ai pu ainsi syncroniser mes deux listes a l'aide de deux balises div

oui bien vu ça permet au moins de conserver les propriétés des selects ...