IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Faire defiler deux listes avec une scroll bar


Sujet :

JavaScript

  1. #1
    Membre régulier
    Inscrit en
    Février 2005
    Messages
    250
    Détails du profil
    Informations forums :
    Inscription : Février 2005
    Messages : 250
    Points : 96
    Points
    96
    Par défaut 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.

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 658
    Points
    66 658
    Billets dans le blog
    1
    Par défaut
    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 ... ???
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre régulier
    Inscrit en
    Février 2005
    Messages
    250
    Détails du profil
    Informations forums :
    Inscription : Février 2005
    Messages : 250
    Points : 96
    Points
    96
    Par défaut
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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.

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 658
    Points
    66 658
    Billets dans le blog
    1
    Par défaut
    oui
    avec des variables lors de la selection stockes dans une variable un selectedIndex perso ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    En attente de confirmation mail
    Profil pro
    Inscrit en
    Octobre 2002
    Messages
    347
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2002
    Messages : 347
    Points : 136
    Points
    136
    Par défaut
    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....

  6. #6
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 658
    Points
    66 658
    Billets dans le blog
    1
    Par défaut
    selects... ou emulation de select ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  7. #7
    Membre régulier
    Inscrit en
    Février 2005
    Messages
    250
    Détails du profil
    Informations forums :
    Inscription : Février 2005
    Messages : 250
    Points : 96
    Points
    96
    Par défaut
    hum... dois je utiliser un évènement du type Onclick pour sélectionner l'élément ?

  8. #8
    Membre régulier
    Inscrit en
    Février 2005
    Messages
    250
    Détails du profil
    Informations forums :
    Inscription : Février 2005
    Messages : 250
    Points : 96
    Points
    96
    Par défaut
    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

  9. #9
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 658
    Points
    66 658
    Billets dans le blog
    1
    Par défaut
    oui bien vu ça permet au moins de conserver les propriétés des selects ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Faire un liste avec une requête
    Par David1259 dans le forum Requêtes et SQL.
    Réponses: 6
    Dernier message: 07/11/2010, 12h50
  2. Réponses: 5
    Dernier message: 19/09/2010, 09h00
  3. Deux choix avec une liste déroulante
    Par BRUNO71 dans le forum VBA Access
    Réponses: 7
    Dernier message: 24/05/2008, 15h34
  4. Réponses: 1
    Dernier message: 15/05/2006, 16h37
  5. Comment faire fonctionner une scroll bar ???
    Par toto4650 dans le forum MFC
    Réponses: 10
    Dernier message: 18/07/2005, 16h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo