Discussion :

[Gwen_59]

Bonjour,

J'ai affaire à un cas assez classique : deux listes déroulantes liées dans une page JSP. Le contenu de la deuxième est alimentée en fonction de la sélection de la première. Je cherche à faire cette alimentation en Ajax. En cherchant sur Internet, j'ai trouvé un exemple mais fait en PHP. J'ai donc cherché à l'adapter en java. Pourtant cela ne fonctionne pas. (Je suis débutant en Ajax)
Dans mon cas, la première liste contient des plateformes, et en fonction de celle choisie, je souhaite alimenter la deuxième liste avec des catégories de produit.

Voici mon code :

page JSP : (j'utilise du JSTL dans mes JSP mais cela ne change rien pour mon problème)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<select id="plateforme" name="plateforme" onchange="go();">
     <c:forEach items='${listePlateformes}' var='plateforme'>
     <option value="${plateforme.idPlateforme}">${plateforme.libelle} </option>
     </c:forEach>
</select>
 
<div id='categorieProduit' style='display:inline'>
   <select name="categorieProduit">
   </select>
</div>

Ajax :

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
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;
}

/**
* Méthode qui sera appelée sur le changement de valeur de la première liste
*/
function go(){
	var xhr = getXhr();
	// On définit 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('categorieProduit').innerHTML = leselect;
	}
}

// JE PENSE QUE C EST ICI QU IL Y A UN PROBLEME CAR DANS L EXEMPLE, ON APPELLE UNE PAGE PHP MAIS LA ...
xhr.open("POST","afficherCateg.jsp",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
plateformeselectionnee = document.getElementById('plateforme');
idPlateforme = plateformeselectionnee.options[plateformeselectionnee.selectedIndex].value;
alert(idPlateforme); // RECUPERE LE BON ID DANS LA PREMIERE LISTE
xhr.send("idPlateforme="+idPlateforme); //COMMENT LE RECUPERER DANS "afficherCateg.jsp" ? 
}

page afficherCateg.jsp :

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
	<%
	
	String id= request.getAttribute("idPlateforme").toString(); //ON LE RECUPERE DANS LA REQUEST ??
		if(id!=null && id!=""){
			int idPlateforme =  Integer.parseInt(id);	
		        out.println("<select name='categorieProduit' ");
		        List<CategorieProduitVO> lesCategProduitVO = FabriqueMetier.getInstance().getMetierCategorieProduit().listerCategorieProduitParIdPlateforme(idPlateforme);
			for(CategorieProduitVO c : lesCategProduitVO){
				out.println("<option value='"+c.getIdCateg()+"'>"+c.getLibelle()+"</option>");
			}
		
		out.println("</select>");
	        }
	
	%>

Je n'ai aucun bug, mais rien ne s'affiche. Je sais juste que je passe bien dans ma fonction go().

Merci d'avance.

[Gwen_59]

Aucune idée ? :/

Svp

[fxrobin]

Salut,

Il te faut le récupérer la variable sur l'instance request :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

String id = request.getParameter("idPlateforme");

Juste pour info, les "attributs" de request que tu utilises, ne servent pas à récupérer ce qui est transmis par l'URL (que ce soit GET ou POST) mais à poser / récupérer temporairement des variables pour le traitement de la request.