liste déroulante php

Version imprimable

Bonjour, j'ai une liste déroulante et je voudrais qu'en fonction de ce que je choisis dans cette liste une table soit rempli avec différentes valeurs mais quand je choisi une option rien ne se passe et je n'arrive pas à comprendre pourquoi. Qulqu'un peut m'aider svp ?

La liste :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<form name = "formulaire">
          <select name = "formationVoulue" size = "1" onClick="envoiRequete()">' ;
 
		  foreach($bdd->afficherNomSFormationS() as $key=>$formation)
		  {
			echo'<option>'.$formation.'</option>' ;
		  }
 
		  echo'
		  </select>
	  </form><br><br>
	<!--div id="formationChoisie" style="width:850px ; height:220px ;display:block ; background-color:red"></div-->
	<table id="formationChoisie" border="1" width="45%">
			  <tr><td width="33%" align="center">Sequence</td>
			  <td width="33%" align="center">Cours</td>
			  <td width="33%" align="center">Ressource</td></tr>
	</table>

Requete Ajax :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function envoiRequete()
{
	objetRequete = new XMLHttpRequest() ;
 
    for (i=1 ; i<=16 ; i++)
        {
            if (this.document.formulaire.formationVoulue.options[i-1].selected)
                {
                    objetRequete.open("GET", "/groupoffice-com-3.5.7/modules/testmodule/classes/FormationVoulue.php?form="+i, true) ;
                    objetRequete.onreadystatechange = traiteReponse ;
                    objetRequete.send(null) ;
                }
        }
}
 
function traiteReponse()
{
	objetRequete = new XMLHttpRequest() ;
    if (objetRequete.readyState == 4)
        {alert("aaa") ;
            document.getElementById("formationChoisie").innerHTML = objetRequete.responseText ;
        }
}

FormationVoulue.php

Code:

1
2
3
4
5
6
7
8
9
10
11
<?php
 
    $choix = $_GET['form'] ;
	$_SESSION['choix'] = $choix ;
 
 foreach($bdd->afficherParcours() as $key=>$parcours)
		{
			echo'<tr><td width="25%" align="center">'.$parcours['Sequence'].'</td>';
			 echo'<td width="25%" align="center">'.$parcours['Cours'].'</td>'; 
			echo'<td width="25%" align="center">'.$parcours['NomRessource'].'</td></tr>'; 
                }

Bonjour,

Plutôt que l'événement onclick sur le select, j'aurais utilisé l'événement onchange.
Ensuite, j'aurais utilisé l'attribut value des balises option comme ça, dans le javascript, j'aurais eu accès directement à l'option choisie :

Code:

this.document.formulaire.formationVoulue.value

Enfin, ta gestion de la requête Ajax ne me parait pas correcte :
Les fonctions envoiRequete et traiteReponse devraient manipuler le même objet xhr (objetRequete), ce qui n'est pas le cas.

Je te propose un squelette que tu peux peut-être adapter à ton problème :
Liste déroulante à faire générer par le PHP :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 
<form name = "formulaire">
<select name = "formationVoulue" size = "1" onchange="envoiRequete()">
<option value="0">-----------</option>
<option value="1">Formation 1</option>
<option value="2">Formation 2</option>
<option value="3">Formation 3</option>
<option value="4">Formation 4</option>
<option value="5">Formation 5</option>
<option value="6">Formation 6</option>
</select>
</form>
<br/>
<br/>
 
<table id="formationChoisie" border="1" width="45%">
  <tr>
    <td width="33%" align="center">Sequence</td>
    <td width="33%" align="center">Cours</td>
    <td width="33%" align="center">Ressource</td>
  </tr>
</table>

Requête Ajax :

Code:

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
<script type="text/javascript">
function getXhr(){
	var xhr = null; 
	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; 
	} 
	return xhr;
}
function envoiRequete()
{
  var xhr = new XMLHttpRequest() ;
  var i=this.document.formulaire.formationVoulue.value;
  xhr.open("GET", "formationVoulue.php?form="+i, true) ;
  xhr.onreadystatechange = function() {
    document.getElementById("formationChoisie").innerHTML = xhr.responseText ;
  }
  xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
  xhr.send(null) ;
}
</script>

Traitement de la requete Ajax :

Code:

1
2
3
4
5
6
7
8
9
10
<?php 
$choix = $_GET['form'] ;
// A remplacer par l'accès à la BDD
$fv=array(0=>array("Séquence","Cours","Ressource"),1=>array("s1","c1","r1"),2=>array("s2","c2","r2"),3=>array("s3","c3","r3"),4=>array("s4","c4","r4"),5=>array("s5","c5","r5"),6=>array("s6","c6","r6"));
?>
<tr>
<td width="25%" align="center"><?php echo $fv[$choix][0]; ?></td>
<td width="25%" align="center"><?php echo $fv[$choix][1]; ?></td>
<td width="25%" align="center"><?php echo $fv[$choix][2]; ?></td>
</tr>

Fred

07/07/2010, 14h16
samuel4256

Ca fonctionne merci beaucoup.