Recuperer variable d'un select multiple via javascript

Recuperer variable d'un select multiple via javascript - HTML/CSS - Programmation

Marsh Posté le 03-11-2008 à 22:23:29    

Bonjour je souhaite récupérer une sélection dans un menu déroulant et l'afficher dans un input, malheureusement seul le premier élément de la liste s'afficher malgré la selection d'une autre valeur.
 
Function javascript pour récupérer l'élément sélectionne et l'afficher:
 

Code :
  1. function recup() {
  2. var r= document.getElementById('RR').innerHTML;
  3. document.form.address.value=r;
  5. };


 
Requête qui rempli ma liste:
 

Code :
  1. <?php
  2. if(isset($_POST["pays"])){
  3.  if (mysql_connect("localhost","root","" ) ) {
  4.   if (mysql_select_db("maps" ) ) {
  5.    $requete = "SELECT Region FROM listevilles WHERE pays='".$_POST["pays"]."'";
  6.    if ($res = mysql_query($requete) ) {
  7.     echo "<select name='Region' onChange='recup();' >";
  8.     while($row = mysql_fetch_assoc($res)){
  9.      echo "<option id='RR' value='Region'".$row["id"]."'>".$row["Region"]."</option>";
  10.           }
  11.     echo "</select>";
  12.    } else {
  13.     echo "Erreur de requête";
  14.    }
  15.   } else {
  16.    echo "Erreur sélection de base de données";
  17.   }
  18.  } else {
  19.   echo "Erreur de connexion mysql";
  20.  }
  21.     } else {
  22.  echo "pays non défini";
  23. }
  24. ?>


Reply

Marsh Posté le 03-11-2008 à 22:23:29   

Reply

Marsh Posté le 04-11-2008 à 08:30:47    

Bonjour,
 
Je ne vois pas de 'select multiple' dans ton formulaire.
 
Exemple pour un select multiple' :

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" dir="ltr">
  5.   <head>
  6.     <meta http-equiv="content-Type" content="application/xhtml+xml; charset=iso-8859-1"/>
  7.     <title></title>
  8.     <script type="text/javascript">
  9.       function recupSelection(src, dest)
  10.       {
  11.         var valeur = src.options[src.selectedIndex].value;
  12.         if (valeur = '')
  13.           return;
  14.          
  15.         dest.value += src.options[src.selectedIndex].value + 'n';
  16.         src.selectedIndex = 0;
  17.       }
  18.     </script>
  19.   </head>
  20.   <body>
  21.     <form name="formulaire">
  22.       <select name="test[]" multiple="multiple" onchange="recupSelection(this, this.form.resultat)">
  23.         <option value="" selected="selected">-- Sélectionnez une valeur --</option>
  24.         <option value="tata">tata</option>
  25.         <option value="tete">tete</option>
  26.         <option value="titi">titi</option>
  27.         <option value="toto">toto</option>
  28.         <option value="tutu">tutu</option>
  29.       </select>
  30.       <br />
  31.       <textarea name="resultat"></textarea>
  32.       <br />
  33.       <input type="reset" value="Effacer" />
  34.     </form>
  35.   </body>
  36. </html>


Et pour un 'select simple' :

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2.   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" dir="ltr">
  5.   <head>
  6.     <meta http-equiv="content-Type" content="application/xhtml+xml; charset=iso-8859-1"/>
  7.     <title></title>
  8.     <script type="text/javascript">
  9.       function recupSelection(src, dest)
  10.       {
  11.         var valeur = src.options[src.selectedIndex].value;
  12.         if (valeur = '')
  13.           return;
  14.          
  15.         dest.value = src.options[src.selectedIndex].value;
  16.         src.selectedIndex = 0;
  17.       }
  18.     </script>
  19.   </head>
  20.   <body>
  21.     <form name="formulaire">
  22.       <select name="test" onchange="recupSelection(this, this.form.resultat)">
  23.         <option value="" selected="selected">-- Sélectionnez une valeur --</option>
  24.         <option value="tata">tata</option>
  25.         <option value="tete">tete</option>
  26.         <option value="titi">titi</option>
  27.         <option value="toto">toto</option>
  28.         <option value="tutu">tutu</option>
  29.       </select>
  30.       <br />
  31.       <input type="text" name="resultat" value="" />
  32.       <br />
  33.       <input type="reset" value="Effacer" />
  34.     </form>
  35.   </body>
  36. </html>
  38. ATTENTION ! manque un backslash entre les apostrophes et devant le n sur cette ligne : dest.value += src.options[src.selectedIndex].value + 'n';
  39. effacé par l'éditeur.


Message édité par jeca le 04-11-2008 à 08:35:19
Reply

Marsh Posté le 04-11-2008 à 17:28:45    

Effectivement il ne s'agir pas ici d'un select multiple comme expliqué dans ton titre, mais dans le corps de ton message tu dis "menu déroulant" donc j'ai tendance à croire qu'il s'agit bel et bien d'un select "normal" mais que tu as confondu le nom :)

 


- S'il s'agit d'un select multiple quand même :
* Il manque le mot MULTIPLE dans ta balise html du select.
* tu dois mettre "[]" après le nom de ta variable si tu veux espérer l'exploiter en PHP par la suite.

 

- S'il s'agit d'un select normal :
La valeurs ne se récupèrent pas avec un "innerHTML", qui est utilisé pour récupérer les valeurs des champs comme "<textarea>".
Voici comment ça marche :

 
Code :
  1. function recup() {
  2.    var r= document.getElementById('RR').options[document.getElementById('RR').selectedIndex].value;
  3.    document.form.address.value=r;
  4. }



Message édité par ZeBix le 04-11-2008 à 17:30:51
Reply

Marsh Posté le 04-11-2008 à 23:51:06    

Merci pour vos infos je débute et confond donc les termes. Mais si le multiple n'apparait pas c parce que j'ai du l'enlever, j'ai effectuer plusieurs test avant de poster et cela sans succès. Du coup j'ai collé le code sans le multiple.
Je vais analyser vos code en espérant y trouver ma réponse ^^.

Reply

Marsh Posté le 05-11-2008 à 00:21:19    

Quand je test ton code zebix, FireFox me retourne un "document.getElementById("RR" ).selectedIndex is undefined", comment le définir?
merci

Reply

Marsh Posté le 05-11-2008 à 01:06:39    

Résolu grace à:  
 
f=form, s=select

Code :
  1. function recup() {
  2.        var r= document.f.s.options[document.f.s.selectedIndex].value;
  3.        document.form.address.value=r;
  4.     };



Message édité par bm3w325i le 05-11-2008 à 01:07:14
Reply

Marsh Posté le 05-11-2008 à 10:58:51    

Oui mon code était pour un select normal. Pour un select multiple, tu vas avoir des problèmes si plusieurs éléments sont sélectionnés, parce que le selectedIndex sera (je pense) une array ...  Fais des tests en sélectionnant plusieurs éléments de ton select, et regarde ce que ça donne ...  

Reply

Marsh Posté le 05-11-2008 à 15:00:41    

En fait je suis obligé de faire un <select> simple, car la valeur du <select> et utilisée dans le géocodeur de google , qui n'accepte apparemment qu'un seul nom à la fois. Mais bon la ca marche bien.
par contre lorsque je rafraîchi ma page au lieu de retourner sur le sélectionnez de ma liste déroulante il reste sur le dernier choix effectué un idée?

Reply

Sujets relatifs:

Leave a Replay

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