Bonjour,
J'ai deux selects dans une page JSP.
Le premier select est complété.
Le deuxième est vide.
Lorsque je choisi une valeur dans le premier, le deuxième doit se remplir en fonction de la valeur choisie dans le premier.
Voici en gros mon code :
JSP principale :
Le code ajax qui est bien intégré dans la JSP précédente :
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 .... <form action="ControllerPrincipal" > <label>No de libre</label> <select name="book" onchange="htmlData(this.value, 'GetChapters')"> <option value="">-------------</option> <c:forEach var="cl" items="${requestScope.cl}"> <option value="${cl.num}">${cl.nom}</option> </c:forEach> </select> <label>No chapitre</label> <span id="equ"> <select name="chapitres" id="selecchapitres"> <option value="">--------------</option> </select> </span> <input type="submit"/> </form> ...
Controlleur GetChapters.java :
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 function GetXmlHttpObject(handler) { var objXMLHttp=null if (window.XMLHttpRequest) { objXMLHttp=new XMLHttpRequest() } else if (window.ActiveXObject) { objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP") } return objXMLHttp } function stateChanged() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { alert(xmlHttp.responseText); document.getElementById("equ").innerHTML = xmlHttp.responseText; } else { //alert(xmlHttp.status); } } function htmlData(selectedValue, url) { if (url.length==0) { document.getElementById("equ").innerHTML="erreur"; alert("URL equals FAIL"); return; } xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request"); return; } url=url+"?dropDown="+selectedValue; url=url+"&sid="+Math.random(); xmlHttp.onreadystatechange=stateChanged; xmlHttp.open("GET",url,true); xmlHttp.send(null); }
Et enfin, la JSP "replaceText.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
17
18
19
20
21
22
23
24
25
26
27
28public class GetChapters extends HttpServlet { Collection<ChapitresDto> chapters; @Override public void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException { HttpSession session = request.getSession(); session.setMaxInactiveInterval(60 * 60); String livre = request.getParameter("dropDown"); try { chapters = MaFacade.getChapsDeLivre(Integer.parseInt(livre)); } catch (BLException ex) { Logger.getLogger(GetChapters.class.getName()).log(Level.SEVERE, null, ex); } session.setAttribute("chapters", chapters); RequestDispatcher rd = request.getRequestDispatcher("replaceText.jsp"); rd.forward(request, response); } @Override public void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException { } }
A l'exécution le premier select est bien rempli avec les bonnes valeurs, le deuxième select contient uniquement "-----------". Quand je change une valeur sur le premier select, le deuxième select disparait complètement au lieu d'être rempli avec les valeurs adéquates...
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 <%@page contentType="text/html" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@page isELIgnored="false"%> <select name="chapterDropDown" id="chapterDropDown"> <option value="">--------------</option> <c:forEach var="chapters" items="${chapters}"> <option value=${chapters.num}>${chapters.num}</option> </c:forEach> </select>
Pourriez-vous m'aider?
Merci d'avance
Partager