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 :

Probleme 3 liste deroulante [AJAX]


Sujet :

JavaScript

  1. #1
    Membre confirmé
    Profil pro
    Inscrit en
    Novembre 2004
    Messages
    155
    Détails du profil
    Informations personnelles :
    Âge : 38
    Localisation : France, Loire (Rhône Alpes)

    Informations forums :
    Inscription : Novembre 2004
    Messages : 155
    Par défaut Probleme 3 liste deroulante [AJAX]
    Bonjour,
    dans un formulaire d'inscription, je fait choisir une région , ce qui affiche dans une deuxieme liste la liste des departements.

    Ceci marche très bien mais j'essaye que lorsque l'utilisateur choisi un département, la liste des villes s'affiche dans une troisieme liste. Ceci ne marche pas, j'ai une erreur javascript.

    Voici le code javascript de ma 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
    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
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    <script type='text/javascript'>
    			var xhr = null;
     
    			function getXhr(){
    				if(window.XMLHttpRequest) // Firefox et autres
    				   xhr = new XMLHttpRequest();
    				else if(window.ActiveXObject){ // Internet Explorer
    				   try {
    			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
    			            } catch (e) {
    			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
    			            }
    				}
    				else { // XMLHttpRequest non supporté par le navigateur
    				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
    				   xhr = false;
    				}
    			}
     
    			/**
    			* Méthode qui sera appelée sur le click du bouton
    			*/
    			function go(){
    				getXhr();
    				// On défini ce qu'on va faire quand on aura la réponse
    				xhr.onreadystatechange = function(){
    					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    					if(xhr.readyState == 4 && xhr.status == 200){
    						leselect = xhr.responseText;
    						// On se sert de innerHTML pour rajouter les options a la liste
    						document.getElementById('departement').innerHTML = leselect;
    					}
    				}
     
    				// Ici on va voir comment faire du post
    				xhr.open("POST","listedep.php",true);
    				// ne pas oublier ça pour le post
    				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    				// ne pas oublier de poster les arguments
    				// ici, l'id de l'auteur
    				sel = document.getElementById('region');
    				idregion = sel.options[sel.selectedIndex].value;
    				xhr.send("idregion="+idregion);
    			}
    			function gp(){
    				getXhr();
    				// On défini ce qu'on va faire quand on aura la réponse
    				xhr.onreadystatechange = function(){
    					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
    					if(xhr.readyState == 4 && xhr.status == 200){
    						leselect = xhr.responseText;
    						// On se sert de innerHTML pour rajouter les options a la liste
    						document.getElementById('ville').innerHTML = leselect;
    					}
    				}
     
    				// Ici on va voir comment faire du post
    				xhr.open("POST","listeville.php",true);
    				// ne pas oublier ça pour le post
    				xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    				// ne pas oublier de poster les arguments
    				// ici, l'id de l'auteur
    				sel = document.getElementById('departement');
    				id = sel.options[sel.selectedIndex].value;
    				xhr.send("id="+id);
    			}
     
    		</script>
    Voici mon script PHP( j'ai vérifié il fonctionne) qui va chercher la liste des villes:
    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
    // Connexion à la base de données
    include("config.php");
     
    $iddep=$_POST["id"];
     
    echo "<select name='ville' class=\"case\" style=\"width:180px;\">";
    	if(isset($_POST["id"]))
    	{
    	  if($_POST["id"]>0)
    	  {	
    		$res = mysql_query("SELECT * FROM ville	WHERE ID_DEP='$iddep' ORDER BY NOM_VILLE");
    		while($row = mysql_fetch_assoc($res)){
    			echo "<option value=".$row["ID_VILLE"].">".$row["NOM_VILLE"]."</option>";
    		}
    	  }
    	  else
    	  {
    		echo "<option value='-1'>Choisir un d&eacute;partement</option>";
    	  }
    	}
    	echo "</select>";
    et voici l'appel sur la liste déroulante des departements:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    echo "<select name='departement' class=\"case\" style=\"width:180px;\" onchange=\"gp()\">";
    Quelqu'un voit il dou vient le problème?

    merci d'avance

  2. #2
    Membre Expert
    Avatar de FremyCompany
    Profil pro
    Étudiant
    Inscrit en
    Février 2006
    Messages
    2 532
    Détails du profil
    Informations personnelles :
    Âge : 33
    Localisation : Belgique

    Informations professionnelles :
    Activité : Étudiant

    Informations forums :
    Inscription : Février 2006
    Messages : 2 532
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
                // Ici on va voir comment faire du post 
                xhr.open("POST","listedep.php",true); 
                // ne pas oublier ça pour le post 
                xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
                // ne pas oublier de poster les arguments 
                // ici, l'id de l'auteur 
                sel = document.getElementById('region'); 
                idregion = sel.options[sel.selectedIndex].value; 
                xhr.send("idregion="+escape(idregion));
    et
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
                   if(xhr.readyState == 4 && xhr.status == 200){ 
                      var leselect = null
                      leselect = xhr.responseText; 
                      // On se sert de innerHTML pour rajouter les options a la liste 
                      document.getElementById('departement').innerHTML = leselect; 
                   }

Discussions similaires

  1. [AJAX] Formulaire liste deroulante ajax
    Par trilla dans le forum Général JavaScript
    Réponses: 1
    Dernier message: 28/08/2007, 19h47
  2. [MySQL] Probleme avec liste deroulante et requete
    Par castelligreg dans le forum PHP & Base de données
    Réponses: 4
    Dernier message: 06/12/2006, 14h39
  3. [AJAX] Liste déroulante pour afficher les informations en ajax div ?
    Par rob2-9 dans le forum Général JavaScript
    Réponses: 13
    Dernier message: 17/11/2006, 09h06
  4. problème quantité liste déroulante,
    Par kitty2006 dans le forum Langage
    Réponses: 6
    Dernier message: 03/10/2006, 10h29
  5. [AJAX] liste deroulante ajax
    Par klimero dans le forum Général JavaScript
    Réponses: 15
    Dernier message: 25/04/2006, 15h26

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