Discussion :

[franfr57]

Bonjour je voudrais faire des lsites déoulantes lié a des bases de données en ajax.
Je voudrais déja faire que si le pays de la france est choisi faire apparaitre une liste de département sinon rien tout ça en ajax...
Mais je ne sais pas trop comment faire :

J'ai déja fait dans ma page principale une liste de pays :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<select name="pays" onchange="go()">
		<option value="NULL">Choisissez votre pas</option>
		<%
		if rs.recordcount>0 then rs.movefirst
 		while not rs.eof
		%>
			<option value="<%=rs("PaysId")%>"><%=rs("PaysNom")%></option>
		<%
		rs.movenext
 		wend
		%>
	</select>

ainsi que rajouté du code js :

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
 
<script language = "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 go()
{
	var xhr = 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('pays').innerHTML = leselect;
		}
	}
	// Ici on va voir comment faire du post
	xhr.open("POST","../departement.asp",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, le dep choisi dans le déroulant DEP
	sel = document.getElementById('pays');
	pays = sel.options[sel.selectedIndex].value;
	xhr.send("pays="+pays);
}
</script>

et aussi crée une page departement.asp pour appel 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
 
<%
response.buffer=true
response.write("<select name='departement'>")
if request("pays")<>"-1" then%>
<!--#include file="../connexion.asp" -->
	<%set rs=server.createObject("adodb.recordset")
	requete="SELECT * FROM TBLDEPARTEMENT WHERE DepartementPaysId='" & request("pays") & "' ORDER BY DepartementCode"
	rs.open requete, connecteur,1,2,1
	while not rs.eof
		response.write("<option value='" & rs("DepartementId") & "'>" & rs("DepartementCode")&" - "&rs("DepartementNom") &"</option>")
		rs.movenext
	wend
	rs.close
	connecteur.close
end if
response.write("</select>")
%>

Mais je ne sais pas ce qu'il faut faire ensuite, comment mettre ma liste département sur ma page principale?

Merci pour votre aide

[Djakisback]

Salut,
apparemment le problème se situe ici :

document.getElementById('pays').innerHTML = leselect;

tu demandes d'ajouter le select des départements dans celui des pays.

Le plus simple, t'ajoutes un div avec un id sur ta page, puis :

document.getElementById('id_du_div').innerHTML = leselect;

Si tu as des problèmes d'accents tu peux spécifier l'encodage avec Response.ContentType
Bye

[franfr57]

Non en fait le problème, c'est que je ne sais pas comment mettre ma liste de département sur ma page principale!

[jeje13009]

salut,

tu places la balise select dès le départ et de la sorte :

Code :

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

1
2
3
<select id='select_dept' disabled='disabled'>
<option value=''>Choisir le Département</option>
</select>

ensuite, dans ta fonction de callback :
1- si ton responseText est vide alors rien ne se passe ;

2- ton responseText contient des informations :
à l'aide d'une boucle tu ajoutes les options à la liste de la manière suivante :

Code :

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

1
2
 
document.getElementById('select_dept').option[a] = new Option ('value_option','nom_de_loption');

'a' étant initialisé à 1 et incrémenté à chaque tour.
Puis toujours dans la fonciton de callback, une fois la boucle traitée :

Code :

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

1
2
 
document.getElementById('select_dept').disabled = false;

voila, chui dsl mais jpeux pas mieux faire car je ne fais pas d'asp... il faut donc que tu adaptes