Autocompletion ne renvoie pas les résultats

**95sisi** · 06/06/2014, 12h01

Bonjour,

J'ai suivi ce tutoriel http://x-zolezzi.developpez.com/tuto...utocompletion/ , pour faire de l'autocompletion code Postale /ville mais je rencontre un petit problème.

J'ai repris exactement le même code que l'auteur :

Index.html : j'ai juste changé les import afin d'avoir des versions plus récentes de jquery et autres (mais même avec les anciennes versions ça ne fonctionne pas

)

Code html :

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

1
2
3
4
5
6
7
8
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head >
		<title>AutoCompletion</title>
		<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
		<link rel="Stylesheet" type="text/css" src="../Projet2Apporteur/jquery-ui/css/custom-theme/jquery-ui-1.9.2.custom"/>
		<script type="text/javascript">

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
var cache = {};
$(function (){
	$("#cp, #ville").autocomplete({
		source: function (request, response){
			//Si la réponse est dans le cache
			if (('FR' + '-' + request.term) in cache){
				response($.map(cache['FR' + '-' + request.term], function (item){
					return {
						label: item.CodePostal + ", " + item.Ville,
						value: function (){
							if ($(this).attr('id') == 'cp'){
								$('#ville').val(item.Ville);
								return item.CodePostal;
							}
							else{
								$('#cp').val(item.CodePostal);
								return item.Ville;
							}
						}
					}
				}));
			}
			//Sinon -> Requete Ajax
			else{
				var objData = {};
				if ($(this.element).attr('id') == 'cp'){
					objData = { codePostal: request.term, pays: 'FR', maxRows: 10 };
				}
				else{
					objData = { ville: request.term, pays: 'FR', maxRows: 10 };
				}
				$.ajax({
					url: "./AutoCompletion.php",
					dataType: "json",
					data: objData,
					type: 'POST',
					success: function (data){
						//Ajout de reponse dans le cache
						cache[('FR' + '-' + request.term)] = data;
						response($.map(data, function (item){
							return {
								label: item.CodePostal + ", " + item.Ville,
								value: function (){
									if ($(this).attr('id') == 'cp'){
										$('#ville').val(item.Ville);
										return item.CodePostal;
									}
									else{
										$('#cp').val(item.CodePostal);
										return item.Ville;
									}
								}
							}
						}));
					},
					error: function (jqXHR, textStatus, errorThrown){
						alert("erreur :");
					}
				});
			}
		},
		minLength: 3,
		delay: 600
	});
});

Code html :

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

1
2
3
4
5
6
7
8
9
10
		</script>
 
	</head>
	<body>
		<form action="#">
			CP :<input type="text" id="cp" size="6"/>
			Ville : <input type="text" id="ville" />
		</form>
	</body>
</html>

j'ai aussi rajouté ça :

Code :

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

1
2
3
error: function (jqXHR, textStatus, errorThrown){
	alert("erreur :");
}

autoCompletion.php : j'ai changer la ligne 10 pour les informations de connexion

Code php :

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
<?php
require_once('./AutoCompletionSCPVille.class.php');
//Initialisation de la liste
$list = array();
//Connexion MySQL
try{
    $db = new PDO('mysql:host=localhost;dbname=projetapporteur', 'root', '');
    echo "<p> connexion reussie </p>";
}
catch (Exception $ex){
    echo $ex->getMessage();
}
//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM autocomplete WHERE ";
if (isset($_POST["codePostal"])){
    $strQuery .= "CP LIKE :codePostal ";
}
else{
    $strQuery .= "VILLE LIKE :ville ";
}
$strQuery .= "AND CODEPAYS = 'FR' ";
//Limite
if (isset($_POST["maxRows"])){
    $strQuery .= "LIMIT 0, :maxRows";
}
$query = $db->prepare($strQuery);
if (isset($_POST["codePostal"])){
    $value = $_POST["codePostal"]."%";
    $query->bindParam(":codePostal", $value, PDO::PARAM_STR);
}
else{
    $value = $_POST["ville"]."%";
    $query->bindParam(":ville", $value, PDO::PARAM_STR);
}
//Limite
if (isset($_POST["maxRows"])){
    $valueRows = intval($_POST["maxRows"]);
    $query->bindParam(":maxRows", $valueRows, PDO::PARAM_INT);
}
$query->execute();
$list = $query->fetchAll(PDO::FETCH_CLASS, "AutoCompletionCPVille");;
echo json_encode($list);
?>

et AutoCompletionCPVille.class.php

Code php :

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

1
2
3
4
5
6
<?php
class AutoCompletionCPVille {
	public $CodePostal;
	public $Ville;
}
?>

Après avoir écrit 3 chiffres l'alert que j'ai rajouté s'affiche et j'ai ceci comme requete dans la console :

URL de la requête : 	http://localhost/comple/AutoCompletion.php
Méthode de la requête : 	POST
Code d'état : 	HTTP/1.1 200 OK
En-têtes de la requête 11:59:08,000
X-Requested-With:	XMLHttpRequest
User-Agent:	Mozilla/5.0 (Windows NT 6.1; rv:29.0) Gecko/20100101 Firefox/29.0
Referer:	http://localhost/comple/
Pragma:	no-cache
Host:	localhost
Content-Type:	application/x-www-form-urlencoded; charset=UTF-8
Content-Length:	33
Connection:	keep-alive
Cache-Control:	no-cache
Accept-Language:	fr,fr-fr;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding:	gzip, deflate
Accept:	application/json, text/javascript, */*; q=0.01
En-têtes de la réponse Δ46ms
X-Powered-By:	PHP/5.5.12
Server:	Apache/2.4.9 (Win32) PHP/5.5.12
Keep-Alive:	timeout=5, max=99
Date:	Fri, 06 Jun 2014 09:59:08 GMT
Content-Type:	text/html
Content-Length:	2111
Connection:	Keep-Alive

Merci d'avance

**NoSmoking** · 08/06/2014, 09h08

Bonjour,
regarde plutôt dans l'onglet Réponses et non En-têtes ce qui t'est retourné.

J'ai repris exactement le même code que l'auteur :

pas cette impression à lire ton post

**95sisi** · 10/06/2014, 08h50

Envoyé par NoSmoking

pas cette impression à lire ton post

ah bon!?

voila :

Code :

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

1
2
3
4
5
6
7
8
9
10
X-Powered-By:	PHP/5.5.12
Server:	Apache/2.4.9 (Win32) PHP/5.5.12
Keep-Alive:	timeout=5, max=100
Date:	Tue, 10 Jun 2014 06:44:50 GMT
Content-Type:	text/html
Content-Length:	2111
Connection:	Keep-Alive
Contenu de la réponse Δ0ms
<br /> <font size='1'><table class='xdebug-error xe-warning' dir='ltr' border='1' cellspacing='0' cellpadding='1'> <tr><th align='left' bgcolor='#f57900' colspan="5"><span style='background-color: #cc0000; color: #fce94f; font-size: x-large;'>( ! )</span> Warning: require_once(./AutoCompletionSCPVille.class.php): failed to open stream: No such file or directory in C:\wamp\www\comple\AutoCompletion.php on line <i>2</i></th></tr> <tr><th align='left' bgcolor='#e9b96e' colspan='5'>Call Stack</th></tr> <tr><th align='center' bgcolor='#eeeeec'>#</th><th align='left' bgcolor='#eeeeec'>Time</th><th align='left' bgcolor='#eeeeec'>Memory</th><th align='left' bgcolor='#eeeeec'>Function</th><th align='left' bgcolor='#eeeeec'>Location</th></tr> <tr><td bgcolor='#eeeeec' align='center'>1</td><td bgcolor='#eeeeec' align='center'>0.0099</td><td bgcolor='#eeeeec' align='right'>141280</td><td bgcolor='#eeeeec'>{main}( )</td><td title='C:\wamp\www\comple\AutoCompletion.php' bgcolor='#eeeeec'>..\AutoCompletion.php<b>:</b>0</td></tr> </table>
</font> <br /> <font size='1'><table class='xdebug-error xe-fatal-error' dir='ltr' border='1' cellspacing='0' cellpadding='1'> <tr><th align='left' bgcolor='#f57900' colspan="5"><span style='background-color: #cc0000; color: #fce94f; font-size: x-large;'>( ! )</span> Fatal error: require_once(): Failed opening required './AutoCompletionSCPVille.class.php' (include_path='.;C:\php\pear') in C:\wamp\www\comple\AutoCompletion.php on line <i>2</i></th></tr> <tr><th align='left' bgcolor='#e9b96e' colspan='5'>Call Stack</th></tr> <tr><th align='center' bgcolor='#eeeeec'>#</th><th align='left' bgcolor='#eeeeec'>Time</th><th align='left' bgcolor='#eeeeec'>Memory</th><th align='left' bgcolor='#eeeeec'>Function</th><th align='left' bgcolor='#eeeeec'>Location</th></tr> <tr><td bgcolor='#eeeeec' align='center'>1</td><td bgcolor='#eeeeec' align='center'>0.0099</td><td bgcolor='#eeeeec' align='right'>141280</td><td bgcolor='#eeeeec'>{main}( )</td><td title='C:\wamp\www\comple\AutoCompletion.php' bgcolor='#eeeeec'>..\AutoCompletion.php<b>:</b>0</td></tr> </table></font>

**NoSmoking** · 10/06/2014, 18h55

si l'on reprend le retour que tu obtiens c'est éloquent.

( ! ) Warning: require_once(./AutoCompletionSCPVille.class.php): failed to open stream: No such file or directory in C:\wamp\www\comple\AutoCompletion.php on line 2

( ! ) Fatal error: require_once(): Failed opening required './AutoCompletionSCPVille.class.php' (include_path='.;C:\php\pear') in C:\wamp\www\comple\AutoCompletion.php on line 2

tu as donc visiblement des choses à régler coté serveur !

**95sisi** · 11/06/2014, 09h22

Ah oui très juste : il y avait un "S" en trop ^^

Maintenant ça a l'air de fonctionner coté serveur :

Code :

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

1
2
Contenu de la réponse 
<p> connexion reussie </p>[{"CodePostal":"95100","Ville":"Argenteuil"},{"CodePostal":"95101","Ville":"Argenteuil"},{"CodePostal":"95102","Ville":"Argenteuil"},{"CodePostal":"95103","Ville":"Argenteuil"},{"CodePostal":"95104","Ville":"Argenteuil"},{"CodePostal":"95105","Ville":"Argenteuil"},{"CodePostal":"95106","Ville":"Argenteuil"},{"CodePostal":"95107","Ville":"Argenteuil"},{"CodePostal":"95108","Ville":"Argenteuil"},{"CodePostal":"95109","Ville":"Argenteuil"}]

Mais rien ne s'affiche, hormis le message d'erreur que j'ai placé.