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 :

[JS-PHP] Liste déroulante générée dynamiquement


Sujet :

JavaScript

  1. #1
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut [JS-PHP] Liste déroulante générée dynamiquement
    Sur un formulaire, je dispose d'un champ texte, suite à la valeur saisie dans ce champ et suite au déclenchement d'un événement, une liste déroulante doit être généré automatiquement. Je ne sais pas si l'appel que je fait pour entrer dans la fonction est correcte. De plus le paramètre que doit lui passer doit être la valeur contenue dans le champ texte et non pas une valeur en dur comme j'ai fait dans l'exemple.

    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
     
    echo "<input name='txtcodepostal' type='text' id='txtcodepostal' size='5' maxlength='5' value =$valcodepostal onblur='requetecommune(71570)'>";
     
    //document.getElementById('txtcodepostal').value;
     
     
    function requetecommune($cp)
    {
    	if ($cp !="")
    	{
     
    		$requetelistecommune="SELECT * FROM COMMUNE WHERE CPCOMMUNET= '$cp'";
    	}
    	else
    	{
    		$requetelistecommune="SELECT * FROM COMMUNE";
    	}
     
    	echo "<select name='lstcommune'>";
     
    	$reqcommune= mysql_query($requetelistecommune);
     
     
    		while($data = mysql_fetch_array($reqcommune))
    		{				
     
    			if ($data['NUMCOMMUNI']==$valnumerocommune)
    			{
    				echo "<option selected value=".$data['NUMCOMMUNI'].">".$data['NOMCOMMUNT']."</option>";
    			}
    			else
    			{
    				echo "<option value=".$data['NUMCOMMUNI'].">".$data['NOMCOMMUNT']."</option>";
    			}
     
    		}
     
    	echo '</select>';
     
    }

  2. #2
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    Voici un exemple d'affichage de couleurs associé à un produit.
    Tu peux t'en inspirer :
    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
     
    //On recupère les couleurs et on les stock dans un tableau
    $requetecoul=mysql_db_query($base,"select * from ligne_couleur where id_produit='$id'",$db_link);
    $numcoul=mysql_num_rows($requetecoul);
    $indcoul=0;
    while($indcoul<$numcoul)
    {
     $couleur[$indcoul] = mysql_result($requetecoul,$indcoul,"nom_couleur");
     $indcoul++;
    }
     
    // On génère le menu déroulant
    echo"<select name=\"couleur\" id=\"couleur\"><option selected value=\"Couleur non choisie\">Couleurs disponibles ...</option>";
    $idnomcoul=0;
    while($idnomcoul<count($nomcouleur))
    {
     echo"<option value=\"$couleur[$idnomcoul]\">> $couleur[$idnomcoul]</option>";
     $idnomcoul++;
    }
    echo"</select>";

  3. #3
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    L'exemple que tu m'as donné ne correspond pas à ce que je souhaites faire puisque je doit récupérer la valeur du champ texte (code en javascript) et uiliser cette valeur dans une requête pour charger la liste déroulante (code en PHP)

  4. #4
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    Bah si.
    Dans mon exemple $id est une variable php. Donc cette variable peut correspondre à ce que tu veux!

    Si tu dis que $id prend la valeur d'un champ d'un formulaire ca marche!
    Par exemple:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    $id=$_GET['txtcodepostal'];

  5. #5
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    Oui mais en ce qui me concerne, la valeur saisie dans mon champ doit être récupérée en javascript puisque je ne veux pas poster le formulaire. Je doit donc utiliser cette instruction :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    document.getElementById('txtcodepostal').value;
    Mais je ne sais pas comment affecter cette valeur à une variable php.

  6. #6
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    ah oui alors la ca ne marche pas! php est aussi executé coté serveur...
    Je n'avais pas compris que tu ne voulais pas poster ton formulaire...

    Tu peux donner plus de détail?
    Genre quel évenement va déclencher la génération de ta liste déroulante?...

  7. #7
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    Sur l'événement ONBLUR (perte du focus) de mon champ texte je souhaites récupérer la valeur saisie avec l'instruction que j'ai donné au dessus puis à l'aide d'une fonction afficher ma liste déroulante en fonction de la valeur que j'ai saisie. Comme je le disais je ne sais pas comment initialiser une variable php avec du code en javascript ou alors ce n'est pas comme cela qu'l faut faire peut être. regarde le code de mon 1er POST tu comprendra surement mieux ce que je souhaite faire.

  8. #8
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    Tu dois faire une fonction javascript:
    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
     
    <?
    function construisTableauJS($tableauPHP, $nomTableauJS)
    {
       echo $nomTableauJS." = new Array();";
       for($i = 0; $i < count($tableauPHP); $i++){
          if(!is_array($tableauPHP[$i])){
             echo $nomTableauJS."[".$i."] = '".$tableauPHP[$i]."';";
          }
          else{
             construisTableauJS($tableauPHP[$i], $nomTableauJS."[".$i."]");
          }
       }
       return;
    }
     
    //La tu fais une requete qui selectionne toutes les communes et leur code postal
     
    SELECT * FROM COMMUNE
     
    //Tu recuperes les resultats que tu met dans un tableau associatif
    //tu boucles sur tes resultats $cp=code postal et $commune=commune
     
    $tableau_commune[$cp]=$commune;
     
    //Ensuite tu convertis ton tableau php en javascript avec la fonction au dessus:
     
    echo "<script type='text/javascript'>";
    construisTableauJS($tableau_commune, "tableau_commune_js");
    echo "</script> ";
     
    ?>
    //La tu peux transmettre avec l'évenement onblur le tableau associatif au format js:
     
    onBlur="genere_liste(tableau_commune_js);"
     
    <script language=JavaScript>
    function genere_liste(tableau_cp)
    {
     var cp_cherche=document.getElementById('txtcodepostal').value;
     //la tu cherche a l'indice du tableau
     var commune=tableau_cp[cp_cherche];
     //et la variable commune correspond au code postal de txtcodepostal.
     //ensuite si tu veux ajouter dans une liste détoulante, tu utilises new Option
    }
    </script>
    Je te met des exemple de modification de select en javascript
    Ici des tailles sont stockées dans un tableau, et je boucle sur le tableau pour créer un menu déroulant avec toutes les tailles:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
     
    document.getElementById('select').options[0]=new Option("--Tailles--");
    for (i=1; i<taille_produits_js[id_tableau].length+1; i++)
    {
     document.getElementById('select').options[i]=new Option(taille_produits_js[id_tableau][i-1]);
    }
    newOption(valeur affichée entre les balises option, value de l'option)

  9. #9
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    J'utilise ton code qui me parait très très bien:

    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
     
    <? 
     
     
                  echo "<input name='txtcodepostal' type='text' id='txtcodepostal' size='5' maxlength='5' value =$valcodepostal onblur='genere_liste(tableaucommunejs)'>";
     
    ?>
                  </font></td>
                <td><font face="Verdana, Arial, Helvetica, sans-serif">
     
    <?
     
    function construisTableauJS($tableauPHP, $nomTableauJS)
    {
       echo $nomTableauJS." = new Array();";
       for($i = 0; $i < count($tableauPHP); $i++){
          if(!is_array($tableauPHP[$i])){
             echo $nomTableauJS."[".$i."] = '".$tableauPHP[$i]."';";
          }
          else{
             construisTableauJS($tableauPHP[$i], $nomTableauJS."[".$i."]");
          }
       }
       return;
    }
     
    $requetecommune=mysql_query("SELECT * FROM COMMUNE");
     
    $tableaucommune=array();
     
    while($data = mysql_fetch_array($requetecommune))
    {
    	$cp=$data['CPCOMMUNET'];
    	$commune=$data['NOMCOMMUNT'];
    	$tableaucommune[$cp]=$commune;
     
    }
     
    echo "<script language='JavaScript' type='text/JavaScript'>";
    construisTableauJS($tableaucommune, "tableaucommunejs");
    echo "</script>";
     
    ?>
     
    <script language=JavaScript>
    function genere_liste(tableau_cp)
    {
     var cp_cherche=document.getElementById('txtcodepostal').value;
     
     var commune=tableau_cp[cp_cherche];
     
    }
    </script>
    Mais je ne vois pas trop comment charger la liste déroulante en fonction du code postal que j'ai saisie peux tu m'aider

  10. #10
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    Il faut que tu crées ton menu déroulant dans ton code:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
     
    <select name='lstcommune' id='lstcommune'>
    </select>
    Ensuite, dans ta fonction javascript, tu ajoutes au menu déroulant les options correspondant aux communes:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    <script language=JavaScript>
    function genere_liste(tableau_cp)
    {
     //la tu recuperes le code postal saisi dans le champ texte
     var cp_cherche=document.getElementById('txtcodepostal').value;
     
     //la tu recuperes la commune associée à ce code postal
     var commune=tableau_cp[cp_cherche];
     
    //ensuite tu ajoute au menu déroulant la commune
    document.getElementById('lstcommune').options[0]=new Option(commune);
    }
    </script>

  11. #11
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    Le problème c'est que ce code ne marche pas dans mon cas enfin je crois puisque pour un code postal il peut y avoir plusieurs communes. Comment modifier le code pour qu'il réponde à ce que je souhaite faire. Je te remercie encore pour ton aide.

  12. #12
    Membre éprouvé
    Profil pro
    Inscrit en
    Avril 2005
    Messages
    818
    Détails du profil
    Informations personnelles :
    Âge : 41
    Localisation : France, Drôme (Rhône Alpes)

    Informations forums :
    Inscription : Avril 2005
    Messages : 818
    Par défaut
    a ce moment la, tu fais un tableau multidimensionnel avec le code postal :
    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
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
     
    $requetecommune=mysql_query("SELECT * FROM COMMUNE");
     
    $tableaucommune=array();
     
    while($data = mysql_fetch_array($requetecommune))
    {
    	$cp=$data['CPCOMMUNET'];
    	$commune=$data['NOMCOMMUNT'];
     
            //un tableau comme ci dessous va créer un tableau par code postal, et pour chaque code postal il y aura un tableau des communes de ce code postal de 0 à nb_commune_code_postal
    	$tableaucommune[$cp][]=$commune;
     
    }
     
    echo "<script language='JavaScript' type='text/JavaScript'>";
    construisTableauJS($tableaucommune, "tableaucommunejs");
    echo "</script>";
     
    <script language=JavaScript>
    function genere_liste(tableau_cp)
    {
     //la tu recuperes le code postal saisi dans le champ texte
     var cp_cherche=document.getElementById('txtcodepostal').value;
     
     //la tu recuperes les communes associées à ce code postal
     var i;
     var j=0; 
     for(i=0;i<tableau_cp[cp_cherche].length;i++)
     {
       //tu ajoute au menu déroulant la commune
       document.getElementById('lstcommune').options[i]=new Option(tableau[cp_cherche][i]);
     }
     
    }
    </script>
    Ca devrait être pas trop loin de ce que tu cherches à faire.

    Tient moi au courant si ca marche ou pas.

  13. #13
    Membre éclairé Avatar de Sytchev3
    Profil pro
    Inscrit en
    Mai 2005
    Messages
    433
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2005
    Messages : 433
    Par défaut
    Pour le moment je n'ai pas encore testé avec ta solution puisque je POST le formulaire si je perd le focus de mon champ texte. Cette solution n'est pas terrible mais pour le moment ça tourne. Je vais essayé avec ta solution dès que possible mais je me disais que j'allais générer un nombre de tableau assez important : le nombre de tableau sera égal au nombre de code postaux différent. Alors j'espère que cela ne va pas trop ralentir le traitement. Qu'en penses tu ???

Discussions similaires

  1. PHP liste déroulante dynamique
    Par poukette79 dans le forum Langage
    Réponses: 12
    Dernier message: 28/09/2011, 15h25
  2. [PHP-JS] listes déroulantes dépendantes dynamiques
    Par niceen dans le forum Langage
    Réponses: 7
    Dernier message: 22/01/2008, 17h54
  3. Utilisation d'une liste déroulante générée en ASP
    Par arkante1984 dans le forum ASP
    Réponses: 10
    Dernier message: 06/03/2007, 14h14
  4. [AJAX] Listes déroulantes
    Par gscorpio dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 04/12/2006, 09h15

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