Remplir une liste au changement d'une autre liste

**JauB** · 09/01/2007, 17h46

Bonjour,
j'ai deux listes déroulantes. je cherche la manière avec laquelle je détecte le changement de valeur dans la 1ere liste pour mettre à jour ma 2ème liste déroulante selon la données sélectionnée dans la 1ere liste.
Comme:
liste 1 : qui contient les pays.
liste 2 : qui contient les villes.

Quand je change de pays je veux que ma 2ème liste ne contienne que les villes du pays sélectionné.
Merci pour vos réflexions

**willoi** · 09/01/2007, 17h53

Peut tu preciser un peu le contexte?

Tes pays et tes sont dans une base de donnee?
c est dans une page jsp ?

??

**JauB** · 09/01/2007, 19h09

oui exactement ça. toutes mes données ont dans une base de données

**willoi** · 10/01/2007, 09h38

ben ecoute je sais pas exactement ce que tu veux.
Si c est une question de sql ou de jsp ou de java ???

**chennuo** · 10/01/2007, 09h53

Je l'i déjà fait via jsp/struts/sql/ajax

ça marche nickel.

au chargement de ta page, tu charge ton combo avec le liste des pays. sur le onchange, tu lance une requete via ajax pour aller récupérer les villes correspondantes au pays choisi et tu rempliu le combo ville avec l'objet.

**maxf1** · 10/01/2007, 10h06

Oui exactement, si tu veux faire ce que tu souhaites faire,
a ma connaissance il n'y a que l'Ajax qui te permette de faire ca sans raffraichir completement ta page.

C'est vrai que ca peut paraitre un peu lourd de se lancer dans l'ajax quand on a en a jamais fait, mais il faut persevérer.
Si tu n'y arrives pas je pourrait toujours te ramener mon code que j'ai chez moi demain. Il chargé les villes en fonction des codes potaux.

**JauB** · 10/01/2007, 18h07

Envoyé par maxf1

Oui exactement, si tu veux faire ce que tu souhaites faire,
a ma connaissance il n'y a que l'Ajax qui te permette de faire ca sans raffraichir completement ta page.

C'est vrai que ca peut paraitre un peu lourd de se lancer dans l'ajax quand on a en a jamais fait, mais il faut persevérer.
Si tu n'y arrives pas je pourrait toujours te ramener mon code que j'ai chez moi demain. Il chargé les villes en fonction des codes potaux.

en fait je savais que ça pourrait être résolu via AJAX mais vu que je n'en ai jamais fait alors.... :s
peux tu bien m'envoyer ton bout de code et les prérequis?
merci...

**maxf1** · 11/01/2007, 08h10

Je te les enverrais demain car étant donnée que je n'ai pas le net chez moi et que tu me l'as demandé après que je sois parti du taf...

**chennuo** · 11/01/2007, 08h47

voilà un code :

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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-nested.tld" prefix="nested" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%
        ArrayList liste = (ArrayList)request.getAttribute("liste");
%>
<%@page import="java.util.ArrayList"%>
<html:html locale="true">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
		<title>Main</title>
		<link rel="stylesheet" type="text/css" href="/context/css/style.css" />
		<style type="text/css">
                div#ajaxtest { overflow:auto; }
                </style>
 
 
 
		<script type="text/javascript" language="javascript">
                    function makeRequest(url) {
 
                        var http_request = false;
                                var initiale = "?inp_initiales="+document.ajaxForm.inp_initiales.value;
                        if (window.XMLHttpRequest) { // Mozilla, Safari,...
                            http_request = new XMLHttpRequest();
                            if (http_request.overrideMimeType) {
                                http_request.overrideMimeType('text/xml');
                                // Voir la note ci-dessous à propos de cette ligne
                            }
                        } else if (window.ActiveXObject) { // IE
                            try {
                                http_request = new ActiveXObject("Msxml2.XMLHTTP");
                            } catch (e) {
                                try {
                                    http_request = new ActiveXObject("Microsoft.XMLHTTP");
                                } catch (e) {}
                            }
                        }
                
                        if (!http_request) {
                            alert('Abandon :( Impossible de créer une instance XMLHTTP');
                            return false;
                        }
                        http_request.onreadystatechange = function() { alertContents(http_request); };
                        http_request.open('GET', url+initiale, true);
                        http_request.send(null);
                
                    }
                
                    function alertContents(http_request) {
                        //alert(http_request.readyState);
                        if (http_request.readyState == 4) {
                            if (http_request.status == 200) {
                                //alert(http_request.status);
                                    document.getElementById("ajaxtest").innerHTML = http_request.responseText;
                                    //document.ajaxForm.inp_initiales.value = http_request.responseText;
                            } else {
                                alert(http_request.status);
                                alert('Un problème est survenu avec la requête.');
                            }
                        }               
                    }
                    
                    function search(){
                        document.formDevise.submit();
                    }
        </script>
	</head>
	<body>
		<div class="styletest">test css</div>
		<br>
		<bean:message key="connexionSuccesfull" />. <bean:message key="accueil" />, <bean:write name="checkuserform" property="inp_login" />
		<br>
		<html:link page="/display.do"><bean:message key="dspActivity" />.</html:link>
		<br>
		<% if(liste != null) { %>
		<bean:message key="libObj" /> : <%= liste.get(0) %>
		<% } %>
		<br>
		<html:link page="/switch.do?lang=fr&cty=FR">FR</html:link>
		<br>
		<html:link page="/switch.do?lang=en&cty=EN">EN</html:link>
		<br>
		<html:link page="/switch.do?lang=en&cty=US">US</html:link>
		<br>
		<html:link page="/lienStruts.do?lien=pageTest"><bean:message key="checkLanguage" /></html:link>
		<br>
		<html:link page="/lienStruts.do?lien=retourAccueil"><bean:message key="retourAccueil" /></html:link>
		<br>
		<html:link page="/visuTypeVoie.do"><bean:message key="dspTypeVoie" /></html:link>
		<br>
		<div id="footer">
		jsp include : <jsp:include flush="true" page="../common/footer.jsp"></jsp:include>
		<br>
		include file :<%@ include file="../common/footer.jsp" %>
		<br>
		<h4>tiles :</h4> <tiles:insert page="../common/footer.jsp"></tiles:insert>
		</div>
		<br>
		Recherche devises disponibles :
		<html:form action="/searchDevise.do">
			<html:text property="inp_devise"></html:text><br>
			<a href="JavaScript:search();">Search</a>
		</html:form>
		<br>
		<html:form action="/visuUser.do" method="post">	
		<html:text property="inp_initiales" onkeyup="makeRequest('http://localhost:8080/context/visuUser.do');"/>
		<a href="JavaScript:makeRequest('http://localhost:8080/context/visuUser.do');">AJAX</a>
		</html:form>
		<br>
		<div id="ajaxtest" width="500" height="150"></div>
		<br>
		<a href="index.jsp">test lien jsp</a>
		<br>
<img src="/context/images/dojoDemos.gif">
	</body>
</html:html>

**JauB** · 12/01/2007, 09h54

comment faire pour faire marcher ce code?

**maxf1** · 12/01/2007, 10h35

je vois qu'il a été plus rapide que moi pour le code.
Donc c'est bon.

Juste que son code est en utilisant struts.
Si tu n'as pas struts tu changes tout ce qui touche à struts par du html standard.

Remplir une liste au changement d'une autre liste

Servlets/JSP Java

Discussions similaires

Partager

Partager