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 :

Boucle liste image


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    oim
    oim est déconnecté
    Membre confirmé
    Inscrit en
    Décembre 2003
    Messages
    118
    Détails du profil
    Informations forums :
    Inscription : Décembre 2003
    Messages : 118
    Par défaut Boucle liste image
    Bonjour, j'ai hésité entre ici et le forum php j'espère ne pas mettre trompé.
    -----------
    J'ai un menu déroulant qui permet d'afficher une liste d'image avec l'évènement "onChange", je me demande s'il est possible de le mettre dans un "for" pour avoir plusieurs listes sur une même page.

    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
    20
    21
     
    /*Affiche image selectionnee*/
    echo "<script type=\"text/javascript\" language=\"JavaScript\">\n";
    echo "function swapImage() {\n";
    echo "var image = document.getElementById(\"imageToSwap\");\n";
    echo "var dropd = document.getElementById(\"dd\");\n";
    echo "image.src = dropd.value;\n";
    echo "}\n";
    echo "</script>\n";
     
    for($m = 0;$m < 3;$m++){
    echo '<div><img id="imageToSwap['.$m.']" src="imgtesta/1.gif" />
    <br /><br />
    <select id="dd['.$m.']" name="newimg" onChange="swapImage()">
    <option value="imgtesta/1.png">1.png</option>
    <option value="imgtesta/2.gif">2.gif</option>
    <option value="imgtesta/3.gif">3.gif</option>
    <option value="imgtesta/4.gif">4.gif</option>
    <option value="imgtesta/5.jpg">5.jpg</option>
    </select></div><br />';
    }
    Merci !

  2. #2
    Rédacteur
    Avatar de marcha
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2003
    Messages
    1 571
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : Suisse

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2003
    Messages : 1 571
    Par défaut
    Salut,

    Oui c'est possible, une manière de faire c'est de passer $m à ta fonction:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    onchange="swapImage($m)"
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    function swapImage(suffix) {
      var image = document.getElementById("imageToSwap_" + suffix);
      ...
    Je pense que les [ ] ne sont pas des caractères valide pour un ID (à vérifier)
    tu pourrais simplement coller $m à un préfixe connu. éventuellement avec
    un underscore pour améliorer la lisibilité.

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    echo '<div><img id="imageToSwap_$m" src="imgtesta/1.gif" />

  3. #3
    oim
    oim est déconnecté
    Membre confirmé
    Inscrit en
    Décembre 2003
    Messages
    118
    Détails du profil
    Informations forums :
    Inscription : Décembre 2003
    Messages : 118
    Par défaut
    Merci ca fonctionne =
    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
    20
    21
     
    /*Affiche image selectionnee*/
    echo "<script type=\"text/javascript\" language=\"JavaScript\">\n";
    echo "function swapImage(suffix) {\n";
    echo "var image = document.getElementById(\"imageToSwap\" +suffix);\n";
    echo "var dropd = document.getElementById(\"dd\" +suffix);\n";
    echo "image.src = dropd.value;\n";
    echo "}\n";
    echo "</script>\n";
     
    for($m = 0;$m < 3;$m++){
    echo '<div><img id="imageToSwap_'.$m.'" src="imgtesta/1.gif" />
    <br /><br />
    <select id="dd_'.$m.'" name="newimg" onChange="swapImage('.$m.')">
    <option value="imgtesta/1.png">1.png</option>
    <option value="imgtesta/2.gif">2.gif</option>
    <option value="imgtesta/3.gif">3.gif</option>
    <option value="imgtesta/4.gif">4.gif</option>
    <option value="imgtesta/5.jpg">5.jpg</option>
    </select></div><br />';
    }

  4. #4
    oim
    oim est déconnecté
    Membre confirmé
    Inscrit en
    Décembre 2003
    Messages
    118
    Détails du profil
    Informations forums :
    Inscription : Décembre 2003
    Messages : 118
    Par défaut
    Bonjour, une question supplémentaire ; si dans mon value j'ai 2 valeurs, est-ce possible d'utiliser un "explode" pour javascript ?

    J'ai essayé comme ca :

    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
    20
    21
    22
    23
    24
    25
     
    /*Affiche image selectionnee*/
    echo "<script type=\"text/javascript\" language=\"JavaScript\">\n";
    echo "function swapImage(suffix) {\n";
    echo "var myArray = document.getElementById(\"suffix\".exlpode(","));\n";
    echo "var image = document.getElementById(\"imageToSwap_\" +myArray[1]);\n";
    echo "var dropd = document.getElementById(\"dd\" +myArray[1]);\n";
    //echo "var image = document.getElementById(\"imageToSwap\" +suffix);\n";
    //echo "var dropd = document.getElementById(\"dd\" +suffix);\n";
    echo "image.src = dropd.value;\n";
    echo "}\n";
    echo "</script>\n";
     
    for($m = 0;$m < 3;$m++){
    echo '<div><img id="imageToSwap_'.$m.'" src="imgtesta/1.gif" />
    <br /><br />
    <select id="dd_'.$m.'" name="newimg" onChange="swapImage('.$m.')">
    /*modif ajoute de 1,2,3, ds value*/
    <option value="1,imgtesta/1.png">1.png</option>
    <option value="2,imgtesta/2.gif">2.gif</option>
    <option value="3,imgtesta/3.gif">3.gif</option>
    <option value="4,imgtesta/4.gif">4.gif</option>
    <option value="5,imgtesta/5.jpg">5.jpg</option>
    </select></div><br />';
    }
    En faisant comme ca, l'image ne s'affiche pas donc c pas bon mais pourquoi ?

    Merci !

  5. #5
    Rédacteur
    Avatar de marcha
    Homme Profil pro
    Développeur Web
    Inscrit en
    Décembre 2003
    Messages
    1 571
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 54
    Localisation : Suisse

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Décembre 2003
    Messages : 1 571
    Par défaut
    Salut,

    explode a besoin de deux arguments, voir ici

    De plus tu as placé ton explode dans le code javascript si tu l'écrit ainsi.

    Que veux tu faire avec deux valeurs ?

  6. #6
    oim
    oim est déconnecté
    Membre confirmé
    Inscrit en
    Décembre 2003
    Messages
    118
    Détails du profil
    Informations forums :
    Inscription : Décembre 2003
    Messages : 118
    Par défaut
    J'ai fait un tableau avec des for pour le nombre de lignes et de colonnes, en haut du tableau j'ai mis un compteur "$num = 0" et à la fin "$num++" ca me permet de connaitre l'emplacement exact des cases comme ca pour l'enregistrement ds la base je n'enregistre pas tt le tableau mais juste les case ayant du contenu.
    --------
    Donc quand je selectionne une image avec le code du haut j'ai besoin d'avoir le nom de l'image (c bon ca) mais également ca case $num. C pour ca que dans le select pour les options j'ai "value=" 1 , imgtesta/1.png "".
    J'ai essaye de mettre l'explode dans le javascript pour que "suffix" prenne le value[1] c-à-dire l'image.



    Pour le séparateur c vrai mais la facon ecrite est un exemple que j'avais trouvé sur le net

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    echo "var myArray = document.getElementById(\"suffix\".exlpode(","));\n";
     
    ca ?
     
    echo "var myArray = document.getElementById(exlpode(",", suffix));\n";

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

Discussions similaires

  1. QGraphicsView afficher liste images miniatures
    Par mac&cheese dans le forum Qt
    Réponses: 9
    Dernier message: 06/01/2009, 20h21
  2. boucle liste fichier
    Par koKoTis dans le forum Général JavaScript
    Réponses: 3
    Dernier message: 31/10/2008, 17h29
  3. boucle liste fichier
    Par koKoTis dans le forum Langage
    Réponses: 3
    Dernier message: 23/10/2008, 08h58
  4. [W11] Liste images
    Par Pascal26 dans le forum WinDev
    Réponses: 15
    Dernier message: 08/11/2007, 15h35
  5. drag and drop, affichage liste images
    Par nasriOM dans le forum AWT/Swing
    Réponses: 1
    Dernier message: 26/10/2007, 14h13

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