Bonjour à tous,


Je suis en train de créer un champ de recherche intelligent : quand on tape une lettre dans le champs, le nom des villes de son département commençant par ces lettres s'affiche dans une liste déroulante. La liste des villes est stockée dans une base de données. Elle est récupérer et traitée grâce à l'AJAX.

Seul problème, je ne parviens pas à le faire fonctionner correctement. Il refuse de récupérer la valeur du champ de recherche quand on tape une lettre (function onkeyup()) et à me la transmettre au script Php.

Voici les codes :

Champs de recherche :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
 
<input type="text" id="choix_ville" name="choix_ville" style="position:absolute; top:120px; left:163px; height:23px; width:133px;  padding-left:3px; background-image:url(img/boutons/champ_ville.jpg); padding-top:2px; display:none;" onkeyup="ChoixVille();">
 
<div id="choix_ville2" style="position:absolute; top:396px; left:613px; height:200px; width:131px; cursor:pointer; overflow:auto; border:1px solid #CCC; background-color:#fff; display:none; padding-left:3px;">
</div>
Script 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
51
 
function ChoixVille()
{
	if ((document.getElementById("choix_ville2").style.display == "none") && (document.getElementById("dep").value != "00"))
	{
		{
			var xhr; 
			try
			{
				xhr = new ActiveXObject('Msxml2.XMLHTTP');
			}
			catch (e)
			{
				try
				{
					xhr = new ActiveXObject('Microsoft.XMLHTTP');
				}
				catch (e2) 
				{
					try
					{
						xhr = new XMLHttpRequest();
					}
					catch (e3)
					{
						xhr = false;
					}
				}
			}
 
			xhr.onreadystatechange  = function()
			{ 
				if(xhr.readyState  == 4)
				{
					if(xhr.status  == 200) 
					document.getElementById("choix_ville2").innerHTML = xhr.responseText ; 
					else 
					document.getElementById("choix_ville2").innerHTML = "Error code " + xhr.status ;
				}
			};
			Dep = document.getElementById("dep").value;
			Ville = new document.getElementById("choix_ville").value;
			xhr.open( "GET", "php/villes.php?dep="+Dep+"&ville="+Ville,  true);
			xhr.send(null);
		}
 
 
		document.getElementById("choix_ville2").style.display = "block";
		document.getElementById("choix_dep2").style.display = "none";
	}
}
Et script php :

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
 
<?php
 
mysql_connect("********", "*********", "********");
mysql_select_db("*********");
 
$afficher_villes = mysql_query("SELECT * FROM maps_ville WHERE id_departement = '".$_GET["dep"]."' AND nom LIKE '".$_GET["ville"]."%'");
$row_afficher_villes = mysql_fetch_assoc($afficher_villes);
$total_afficher_villes = mysql_num_rows($afficher_villes);
        do
        {
                $villes .= "<div id='ville' onclick=\"Choix_Ville('Choisir','".$row_afficher_villes['nom']."','".$row_afficher_villes['id_ville']."');>".$row_afficher_villes['nom']."</div>
                ";
        }
        while ($row_afficher_villes = mysql_fetch_assoc($afficher_villes));
 
echo $villes ;
?>
Merci d'avance pour votre aide.