Ajax+Php+MySql pour AutoComplétion

**squal31** · 28/07/2011, 08h55

Bonjour à tous,

Je suis en train de réaliser un petit site, avec un formulaire à remplir :
- code postal (cp)
- ville
- sdjkhfskf
- ...

Pour vous mettre directement dans l'ambiance voici une très bonne démo :
http://x-zolezzi.developpez.com/demo...lete/demo.html

La partie cp et ville se fait avec un tuto très intéressant (http://x-zolezzi.developpez.com/tuto...utocompletion/).

Il fonctionne a merveille, une fois une erreur enlevée au niveau de ici :
Dans le fichier :

A la ligne :

Code:

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM autocomplete WHERE ";

qui doit être remplacée par :

Code:

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM cp_autocomplete WHERE ";

Sauf erreur de ma part ... se qui est très possible !
Mais comme la table Sql se nomme : cp_autocomplete (voir en haut du tuto lors de la création de la table)

Alors tout va bien ... ben non, ...
Impossible de faire fonctionner "l'autocompletion" avec la ville "bagnère-de-luchon". Cela fonctionne sur la démo, mais pas sur mon site !?

Si quelqu'un à une idée ...
merci d'avance

Dlzlogic · 28/07/2011, 12h32

Bonjour,
Je ne vois pas pourquoi il faudrait mettre "cp_autocomplete" au lieu de "autocomplete"
"autocomplete" doit être le nom d'une table, je ne sais pas le nom de la table dans laquelle vous voulez lire.
Faites aussi très attention à la distinction majuscules-minuscules, même pour les noms de fichier.
J'ai l'impression que vous avez recopié l'exemple textuellement en utilisant copier-coller, ce n'est sûrement pas la meilleure méthode.

**squal31** · 28/07/2011, 13h07

Merci de ta réponse et de tes remarques, mais regarde ici pourquoi j'ai changé le cp_autocomplete :

Code:

CREATE TABLE IF NOT EXISTS `cp_autocomplete` (
  `CODEPAYS` char(2) NOT NULL,
  `CP` varchar(10) NOT NULL,
  `VILLE` varchar(180) NOT NULL,
  KEY `CODEPAYS` (`CODEPAYS`),
  KEY `CP` (`CP`),
  KEY `VILLE` (`VILLE`)
) ENGINE=MyISAM DEFAULT CHARSET=latin1;

J'ai bien fait également attention au majuscule / minuscule ...
C'est quand même bizarre que tout fonctionne bien, mais pas pour certaines villes !?

Si vous avez d'autres idées ...
merci d'avance

Dlzlogic · 28/07/2011, 13h25

Il peut y avoir 50000 raisons, par exemple le nom de la ville comporte un espace ou une apostrophe, la ville n'est pas fans le fichier géographique, le nom de la ville comporte un caractère non reconnu (caractère accentué), le code postal correspond à plusieurs villes etc.
Mais j'ai très peu d'imagination.

A voir en vidéo sur Futura · Aujourd'hui

**squal31** · 28/07/2011, 13h48

Je suis d'accord avec toi, mais j'ai utilisé la même bdd, les mêmes fichiers .php ... tout est identique ! Pourquoi ça fonctionne pas pour moi ... snif ...

invitea0ecda6e · 09/08/2011, 05h25

squal31,
Est-ce que la liste des proposition s'affiche bien à part uniquement pour la ville "bagnère-de-luchon" ?
Dans ce cas c'est étrange, il faudrait que tu vérifie que la ville soit bien orthographiée dans la base.

**squal31** · 09/08/2011, 20h52

Merci tout d'abord a vous 2, Tlaloc et Dlzlogic d'avoir jeté un coup d'oeil sur mon problème tjs présent ...
J'ai effectivement les propositions qui s'affichent comme prévu, mais pas pour bagnère-de-luchon, je suis allé voir un coup d'oeil dans la base SQL et bagnère-de-luchon est correctement orthographié et bien présent au passage.
Je sais pas si il peut y avoir une relation mais j'utilise aussi FancyBox pour afficher des images. Demain je testerai en enlevant FancyBox pour tester ...
Je vous en dirai plus dès mes essais ...

invitea0ecda6e · 09/08/2011, 21h38

Peux-tu nous mettre tes sources (incluant sql) à dispo?
Perso, je ne pense pas que la FancyBox puisse avoir une influence (ça pourrait éventuellement empecher la liste d'apparaitre mais si tu nous dis que la liste apparait bien dans la plupart des cas...)

**squal31** · 09/08/2011, 22h19

Bon je viens de faire le test en enlevant le FancyBox est effectivement le problème est tjs présent ...

Du coup voila les lignes de codes :

Code:

<!-- FancyBox -->
<script type="text/javascript" src="css/fancybox/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="css/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="css/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="css/fancybox/effects-fancybox.js"></script>
<link rel="stylesheet" type="text/css" href="css/fancybox/jquery.fancybox-1.3.4.css" media="screen" />


<!-- Auto complement -->
<script type="text/javascript" src="css/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="inc/auto-completion.js"></script>
<link rel="Stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" />


<!-- Map jQuery -->
<script type="text/javascript" src="http://maps.google.com/maps?file=api&;amp;v=2&amp;key=ABQIAAAAGZRntOjDRnAlz8qNTR_fCRRXnZ9ahqP1k8ixUlcxFVPzCMiTHhRA_HtSCrE16_JKu_xRLQR5FHGLAw"></script>
<script type="text/javascript" src="inc/jquery.gmap-1.0.0.min.js"></script>

Le fichier auto-completion.js :

Code:

			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;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 3,
					delay: 600
				});
			});

AutoCompletion.php :

Code:

<?php
require_once('./AutoCompletionCPVille.class.php');

//Initialisation de la liste
$list = array();

//Connexion MySQL
try
{
    $db = new PDO('mysql:host=xxx;dbname=xxx', 'xxx', 'xxx');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM cp_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);
?>

La class : AutoCompletionCPVille.class.ph p :

Code:

<?php
class AutoCompletionCPVille {
	public $CodePostal;
	public $Ville;
}
?>

Merci encore pour votre aide ...

**squal31** · 09/08/2011, 22h23

En fait j'ai simplement réutilisé les fichiers qu'il donné ...
Pour le fichier SQL : tout est là : http://x-zolezzi.developpez.com/tuto...te_complet.sql

invitea0ecda6e · 09/08/2011, 23h31

Bon il se trouve qu'il s'agit d'un problème d'encodage, tu dois d'ailleurs avoir le même problème avec toutes tes villes qui contiennent des accents.
Ca vient uniquement du json_encode à la fin du AutoCompletion.php qui n'accepte que du UTF-8.

La solution la plus simple est d'avoir une base de donnée encodée en UTF-8.

Si tu ne veux pas toucher à ta base, il faut te débrouiller pour encoder les caractère avant l'encodage json. Donc tu remplaces ça:

$list = $query->fetchAll(PDO::FETCH_CLASS, "AutoCompletionCPVille");;

echo json_encode($list);

Par ça:

$list = $query->fetchAll(PDO::FETCH_CLASS, "AutoCompletionCPVille");;

foreach ($list as $row){
mb_detect_encoding($row->Ville, "UTF-8") != "UTF-8" ? : $row->Ville = utf8_encode($row->Ville); // encodage des champs texte en utf8 si il ne le sont pas.
}

echo json_encode($list);

D'autre part, il faut aussi décoder ce que tu vas envoyer dans ta requête. Donc remplace ça

else
{
$query->bindParam(":ville", $value, PDO::PARAM_STR);
}

par ça:

else
{
$value = utf8_decode($_POST["ville"])."%";
$query->bindParam(":ville", $value, PDO::PARAM_STR);
}

Et là, ça devrait mieux marcher.

**squal31** · 10/08/2011, 10h10

Mais t'es énorme !
Merci pour ton aide, j'y serais jamais arrivé seul là !
Seul "Hic" ça ne fonctionne tjs pas ...

Comment je pourrai faire pour passer ma base SQL en format qui va bien ?
Quel format d'ailleurs ?

Au cas ou j'aurai fait une erreur je met le code complet de Autocompletion.php :

Code:

<?php
require_once('./AutoCompletionCPVille.class.php');

//Initialisation de la liste
$list = array();

//Connexion MySQL
try
{
    $db = new PDO('mysql:host=xxx;dbname=xxx', 'xx', 'xxx');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM cp_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 = utf8_decode($_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");;

foreach ($list as $row){
mb_detect_encoding($row->Ville, "UTF-8") != "UTF-8" ? : $row->Ville = utf8_encode($row->Ville); // encodage des champs texte en utf8 si il ne le sont pas. 
}

echo json_encode($list);
?>

Encore merci pour ton aide ...

invitea0ecda6e · 10/08/2011, 21h19

Comment ça ça fonctionne toujours pas? Ca fait la même chose qu'avant? Ok pour les villes sans accent et ko pour les villes avec des accents?
Pour changer l'encodage de ta base, essaye ça (je ne l'ai pas essayé mais ça devrait marcher) :

ALTER DATABASE xxx CHARACTER SET utf8 COLLATE utf8_general_ci

**squal31** · 10/08/2011, 23h53

C'est effectivement ça ... ok pour les villes sans accent et ko pour les villes avec ... comme avant ...

Pour la transformation de la base avec :
ALTER DATABASE xxx CHARACTER SET utf8 COLLATE utf8_general_ci
Tu peux me donner d'avantages d'informations ...
Je dois faire une boucle pour chaque id ?

Merci encore de ton aide

invitea0ecda6e · 11/08/2011, 03h30

Non c'est une requête SQL donc tu exécute ça sous ton gestionnaire de base de donnée (phpmyadmin probablement,non ?) comme tu as executer le script sql de création de base de donnée.

Mais ça m'étonne que ça ne marche toujours pas chez toi... Chez moi ça marche très bien avec les sources que tu viens de poster et sans modifier la base de donnée...

**squal31** · 11/08/2011, 09h35

Bon ...
J'ai pas encore fais la manip sur le SQL puisque tu me dis que tout fonctionne chez avec mon code.

Alors, maintenant j'ai plu rien qui fonctionne ...
Voici les manips que j'ai fait :
- J'ai supprimer tout mes fichiers sur mon ftp relatif aux fichiers php, css, js ...
- J'ai crée un dossier jquery dans mon dossier inc et mis dedans jquery-1.4.3.min.js et jquery-ui.js histoire que ce soit plus propre dans les fichiers
- Forcement j'ai modifier mon fichier principal qui contient mes rubriques.php que j'inclu dedans
- Et j'ai tout rebalancé

Tout est normal : mes css, ma carte gmap, ... sauf mon autocompletion ...

Je pense qu'il y a une erreur de lien entre les fichiers, et qu'avant ma manip le code se faisait sur un ancien fichier planqué par la sur le ftp ...
Si tu as le temps de jeter un coup d'oeil sur mes fichiers, leurs emplacements, et les liens entre eux ...

Merci d'avance encore pour ton aide.

Petit tour du propriétaire :
----------------------------
Voir l'image

Pour mes fichiers :
--------------------

fichier pg.php :

Code:

<!-- Chargement des css -->
<link href="css/div-page.css" rel="stylesheet" type="text/css">
<link href="css/div.css" rel="stylesheet" type="text/css">
<link href="css/texte.css" rel="stylesheet" type="text/css">
<link href="css/image.css" rel="stylesheet" type="text/css">
<link href="css/formulaire.css" rel="stylesheet" type="text/css">
<link href="css/popup_layer.css" rel="stylesheet" type="text/css">


<!-- Jquery -->
<script type="text/javascript" src="inc/jquery/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="inc/jquery/jquery-ui.js"></script>


<!-- FancyBox -->
<script type="text/javascript" src="css/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="css/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="css/fancybox/effects-fancybox.js"></script>
<link rel="stylesheet" type="text/css" href="css/fancybox/jquery.fancybox-1.3.4.css" media="screen" />


<!-- Auto complement -->
<script type="text/javascript" src="inc/auto-completion.js"></script>
<link rel="Stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/themes/base/jquery-ui.css" />


<!-- Map jQuery -->
<script type="text/javascript" src="http://maps.google.com/maps?file=api&;amp;v=2&amp;key=ABQIAAAAGZRntOjDRnAlz8qNTR_fCRRXnZ9ahqP1k8ixUlcxFVPzCMiTHhRA_HtSCrE16_JKu_xRLQR5FHGLAw"></script>
<script type="text/javascript" src="inc/jquery.gmap-1.0.0.min.js"></script>

Fichier auto-completion.js

Code:

			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;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 3,
					delay: 600
				});
			});

Fichier : AutoCompletion.php

Code:

<?php
require_once('./AutoCompletionCPVille.class.php');

//Initialisation de la liste
$list = array();

//Connexion MySQL
try
{
    $db = new PDO('mysql:host=xxx;dbname=xxx', 'xxx', 'xxx');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM cp_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 = utf8_decode($_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");;

foreach ($list as $row){
mb_detect_encoding($row->Ville, "UTF-8") != "UTF-8" ? : $row->Ville = utf8_encode($row->Ville); // encodage des champs texte en utf8 si il ne le sont pas. 
}

echo json_encode($list);
?>

invitea0ecda6e · 11/08/2011, 21h24

Essaye dans ton auto-completion.js de remplacer

var cache = {};
$(function ()
{
$("#cp, #ville").autocomplete({

Par

var cache = {};
$(document).ready(function()
{
$("#cp, #ville").autocomplete({

Sinon, faudrait pouvoir faire des tests... est-ce que ta page est en ligne ?

invitea0ecda6e · 11/08/2011, 21h25

Essaye dans ton auto-completion.js de remplacer

var cache = {};
$(function ()
{
$("#cp, #ville").autocomplete({

Par

var cache = {};
$(document).ready(function()
{
$("#cp, #ville").autocomplete({

Sinon, faudrait pouvoir faire des tests... est-ce que ta page est en ligne ?

**squal31** · 11/08/2011, 21h33

Encore merci de ton aide mais ça ne fonctionne tjs pas ...
A mon avis ça ne viens pas du code lui même mais plutot des liens entre les fichiers eux-même puisque avant tout fonctionné nikel ...
Mais impossible de trouver ou est l'erreur ...

Code:

			var cache = {};
				$(document).ready(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;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 3,
					delay: 600
				});
			});

invitea0ecda6e · 11/08/2011, 21h42

Deux questions betes (ne le prend pas mal):
- Tu n'as pas ça comme ça dans ton code ?

Envoyé par squal31

Code:

    $db = new PDO('mysql:host=xxx;dbname=xxx', 'xxx', 'xxx');

- Ta version de jquery ui contient bien le module autocomplete ?

**squal31** · 12/08/2011, 09h44

T'inquiète pas, je ne suis pas susceptible ... et encore moins lorsque ça vient d'une personne qui a la gentillesse de m'aider ...

Alors pour répondre à t'a question 1 :
Voila ce que j'ai (je suis sous ovh) :

Code:

$db = new PDO('mysql:host=mysql5...(serveur);dbname=utilisateur', 'utilisateur', 'mot de passe');

Et pour répondre à la question 2, oui j'ai bien le module autocomplete dans mon jquery ui.
En fait j'ai copier/coller ce code dans un fichier js
http://ajax.microsoft.com/ajax/jquer...0/jquery-ui.js

J'ai une question de mon coté :
E Jc, quand on écris :

Code:

$.ajax({
								url: "./AutoCompletion.php",

Ca veut dire que le fichier est dans le même dossier ?
Idem pour ici :

Code:

require_once('./AutoCompletionCPVille.class.php');

Mais en php cette fois ci.
Car mes 3 fichiers, .js, .php et la class sont dans le même dossier "inc".

Merci encore de ta patience et de ton aide ...

invitea0ecda6e · 12/08/2011, 09h51

Envoyé par squal31

Ca veut dire que le fichier est dans le même dossier ?

Oui ça veut bien dire ça.

Je suis désolé mais je ne vois vraiment pas quel peut être le nouveau problème, il faudrait vraiment que je puisse voir.

Mais si ça marchait mieux avant, essaye déjà de revenir à ton ancienne version.

**squal31** · 12/08/2011, 11h12

Impossible de revenir a l'ancienne version, puisque j'ai tout effacé dans mon ftp ... (histoire de faire du rangement ...)

**squal31** · 13/08/2011, 10h54

Tlaloc ça fonctionne nikel !!!
Après près d'une semaine d'aide, de gentillesse et de patience de ta part !
Merci beaucoup en tout cas, je te laisse m'envoyer la facture ...

Pour ceux qui tomberai par hasard ou pas sur ce post après le même problème voici les fichiers corrects :

Le .js :

Code:

			var cache = {};
				$(document).ready(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: "./inc/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;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 3,
					delay: 600
				});
			});

Et le .php :

Code:

<?php
require_once('./AutoCompletionCPVille.class.php');

//Initialisation de la liste
$list = array();

//Connexion MySQL
try
{
    $db = new PDO('mysql:host=serveur;dbname=base', 'login', 'psw');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}

//Construction de la requete
$strQuery = "SELECT CP CodePostal, VILLE Ville FROM cp_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 = utf8_decode($_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");;

foreach ($list as $row){
$row->Ville = utf8_encode($row->Ville);
}

echo json_encode($list);
?>

Encore merci Tlaloc pour ton aide ...

invitea0ecda6e · 15/08/2011, 21h32

Content d'avoir pu enfin trouver ce qui allait pas !

**squal31** · 20/08/2011, 18h14

Bon revoila le casse bonbon ... moi ...

Je voudrai mettre 2 doubles champs (cp, ville) dans la même page.

Pour cela j'ai créer 3 fichiers supplémentaires :
- completion-recherche.class.php
- completion-recherche.js (que j'inclue dans la page)
- completion-recherche.php

Dans ma page : je rajoute mon 2eme formulaire :

Code:

<form method="post" id="formulaire_solo" action="<?php echo $lien; ?>">
			<input name="cp2" type="text" id="cp2" size="7" maxlength="10" class="text"/>
			<input name="ville2" type="text" id="ville2" size="15" maxlength="100" class="text"/>
			<input type="submit" id="emailsubmit" value="Afficher" class="button" />
		</form>

Comme vous pouvez voir par rapport aux fichiers qui fonctionnent, j'ai renommé les variables en cp2 et ville2 et de même dans les fichiers ..

Si quelqu'un voit quelques choses d'illogique, je suis preneur des remarques ...

Merci d'avance

Pour le fichier : completion-recherche.class.php

Code:

<?php
class completion-recherche {
	public $CodePostal2;
	public $Ville2;
}
?>

Pour le fichier : completion-recherche.js

Code:

			var cache = {};
				$(document).ready(function()
				{
				$("#cp2 #ville2").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')
										{
											$('#ville2').val(item.Ville);
											return item.CodePostal;
										}
										else
										{
											$('#cp2').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: "./inc/completion-recherche.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')
												{
													$('#ville2').val(item.Ville);
													return item.CodePostal;
												}
												else
												{
													$('#cp2').val(item.CodePostal);
													return item.Ville;
												}
											}
										}
									}));
								}
							});
						}
					},
					minLength: 2,
					delay: 300
				});
			});

Et pour le fichier : completion-recherche.php

Code:

<?php
require_once('./completion-recherche.class.php');

//Initialisation de la liste
$list = array();

//Connexion MySQL
try
{
    $db = new PDO('mysql:host=xxx;dbname=xxx', 'xxx', 'xxx');
}
catch (Exception $ex)
{
    echo $ex->getMessage();
}

//Construction de la requete
$strQuery = "SELECT CP CodePostal2, VILLE Ville2 FROM cp_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 = utf8_decode($_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, "completion-recherche");;

foreach ($list as $row){
$row->Ville2 = utf8_encode($row->Ville2);
}

echo json_encode($list);
?>

Dlzlogic · 20/08/2011, 18h31

Bonjour,
Vos sources sont difficiles à lire. Deux caractères de décalage par rapport à la ligne précédente me parait largement suffisant.
Donc, je n'ai pas regardé.

Je ne comprend pas ce que vous voulez dire par "deux doubles champs".
Il est un peu compliqué et ça me parait pas très logique de mettre deux formulaires dans la même page. Bien sûr, c'est possible, mais dans quel but?

Enfin, quel est le problème?

**danyvio** · 21/08/2011, 08h15

Envoyé par Tlaloc

squal31,
Est-ce que la liste des proposition s'affiche bien à part uniquement pour la ville "bagnère-de-luchon" ?
Dans ce cas c'est étrange, il faudrait que tu vérifie que la ville soit bien orthographiée dans la base.

Bagnère s'écrit BagnèreS avec un S à la fin. Peut-être pas dans la base de données, mais c'est un autre problème

**squal31** · 21/08/2011, 10h08

Effectivement Bagnère de luchon ou de bigorre prennent un "s" ... (la base est bonne, mon orthographe beaucoup moins ...).

Le but de mettre 2 formulaires sur la même page :
- L'un est pour centrer la carte sur une ville bien précise
- L'autre pour rajouter des checkpoints (a des villes bien précises)
Donc 2 formulaires complètements différents et placé aux extrémités de la page

Le problème :
Le code js s'emmêle les pinceaux entre les champs des formulaires ...

Si quelqu'un a une idée, ... je suis preneur
Merci d'avance

Dlzlogic · 21/08/2011, 11h02

Bonjour,
A quoi sert un "<form " ?
Réponse
1- à donner la possibilité à l'utilisateur de saisir un certain nombre d'informations.
2- à indiquer au html qu'il doit fermer cette page, prendre sous son bras ou dans ses poches toutes les informations qui y ont été données et gentiment aller faire quelque-chose d'autre.

Code:

$("#cp2 #ville2").autocomplete({

Quand je vois des choses comme ça dans le code de quelqu'un qui débute et qui se perd dans son code, je comprend pourquoi.
Pour cette simple ligne, décomposez-la complètement et écrivez d'abord en français, pour en code, ce que vous voulez faire.

Ajax+Php+MySql pour AutoComplétion

Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Re : Ajax+Php+MySql pour AutoComplétion

Discussions similaires

Gros PB mysql/php

test avec PHP MySQL

[PHP/MySQL] Pb création agenda

Php/MySQL - Ordonner des résultats