Apostrophe jQuery MySQL

**serna** · 12/11/2012, 18h40

Bonjour,
j'essaye d'adapter le tutorial : " Créer ses propres cartes pour jVectorMap et JQVMap "

http://www.jaffredo.com/2012/tutorie...map-et-jqvmap/

quant je teste avec un simple alert comme dans le tuto ça m'affiche bien les département qui on un apostrophe .

quant je passe par un affichage d'une liste de département via une requête sql , ça fonctionne pour les département sans apostrophe mais il m'affiche une erreur quant il y'a un apostrophe ( exemple val d'oise )
mes page sont en utf 8 , header en utf8, tables en utf8
dans la connexion à la base :

Code :

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

$connection->exec("SET CHARACTER SET utf8");

est ce que quelqu’un parmi vous a eu déjà ce problème ?

merci de votre aide

**SpaceFrog** · 13/11/2012, 09h01

SETNAMES

sinon un peu de lecture
http://j-willette.developpez.com/tut...-site-en-utf8/

mais ton souci d'apostrophe vient d'un maque de addslashes cote php

**serna** · 13/11/2012, 09h49

bonjour spacefrog,

je n'ai pas de probleme concernant les caracteres accentués mais seulement pour ceux qui ont un apostrophe .
de plus quant je fait un simple echo ça m'affiche bien les valeurs avec apostrophe.
j'ai toutes mes pages en utf8 ( sauvegardé avec sublime text 2 )
j'ai un header utf8 au début de la page, les tables et la base en utf8

j'ai mis ça dans la connexion à la base (pdo )

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
<?php
 
// Connection au serveur
try {
  $dns = 'mysql:host=localhost;dbname=dbase';
  $utilisateur = 'root';
  $motDePasse = '';
  $connection = new PDO( $dns, $utilisateur, $motDePasse );
  // Options de connection
  $options = array(
      PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION
  );
  $connection = new PDO( $dns, $utilisateur, $motDePasse, $options );
  $connection->exec("SET CHARACTER SET utf8");
// $connection->query("SET NAMES utf8");
} catch ( Exception $e ) {
  echo "Connection à MySQL impossible : ", $e->getMessage();
  die();
}
?>

j'ai une requête sur 3 tables

table regions

region_id, nom, departement_id

table departements

departement_id,region_id

table communes

id_commune, departement,villes

la requete

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
try {
  // On envois la requète
  $select = $connection->query("SELECT u.region_id, u.nom, t.departement_id,t.region_id,t.nom,v.departement,v.villes,v.id_commune
 
FROM regions u JOIN departements t ON t.region_id = u.region_id
 
JOIN communes v ON v.departement = t.nom
 
WHERE  t.nom LIKE '%".$departement."%' ");
 
?>
<?php
 
  $select->setFetchMode(PDO::FETCH_OBJ);
 
 
  while( $enregistrement2 = $select->fetch() )
  {
   
   echo '<h6 >'.$enregistrement2->villes. '</h6>';
  }
} catch ( Exception $e ) {
  echo "Une erreur est survenue lors de la requete";
}
 ?>

au début de la page j'ai

Code :

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

1
2
3
4
5
$villes = ($_GET['villes']);
 
$id_ville =($_GET['id_ville']);
 
$departement =addslashes($_GET['departement']);

pour faire fonctionner la carte de France du tutorial de Gaël Jaffredo cité plus haut, voila les fichier js

Code :

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

1
2
3
4
5
6
7
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
 
    <script src="http://www.jaffredo.com/tutos/jqvmap/jquery.vmap.js" type="text/javascript"></script>
 
    <script src="http://www.jaffredo.com/tutos/jqvmap/jquery.vmap.france.js" type="text/javascript"></script>
 
	<script src="http://www.jaffredo.com/tutos/jqvmap/jquery.vmap.colorsFrance.js" type="text/javascript"></script>

et le fichier js suivant

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
 <script type="text/javascript">
	$(document).ready(function() {
		$('#francemap').vectorMap({
		    map: 'france_fr',
			hoverOpacity: 0.5,
			hoverColor: false,
			backgroundColor: "#ffffff",
			colors: couleurs,
			borderColor: "#000000",
			selectedColor: "#EC0000",
			enableZoom: true,
			showTooltip: true,
		    onRegionClick: function(element, code, region)
		    {
		        var message = '?departement='
		            + region 
 
					+ '';
 
		 <!---->    open(message);
		 window.open(message,'_self');
		    }
		});
	});
</script>

( nota* je pourrais optimiser la table communes qui a une colonne avec les nom de département , remplacer avec un id_departement en lien avec la table département, mais j'ai récuperé la table communes en premier etc.. je le ferais plus tard ! )

encore merci pour le coup de main bienvenue

**SpaceFrog** · 13/11/2012, 09h52

j'ai pas dit "addslashes" ?

**serna** · 13/11/2012, 10h00

oui , j'ai ajouté ça à la derniere ligne de la requete

Code :

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

WHERE  t.nom LIKE '%".addslashes($departement)."%' ");

mais ça ne corrige pas mon problème..

**SpaceFrog** · 13/11/2012, 10h32

non c'est en sortie qu'il faut le mettre ...

**serna** · 13/11/2012, 10h51

merci spacefrog,

j'ai fait ça

Code :

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

addslashes($enregistrement2->villes

mais ça ne marche pas

**SpaceFrog** · 13/11/2012, 15h18

Peux tu nous monter le html généré ?

**serna** · 13/11/2012, 21h01

la sortie html quant je clique sur un departement sans apostrophe

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
 
<!DOCTYPE html>
<html lang="fr">
  <head>
   <meta charset="utf-8" />
   <meta http-equiv="X-UA-Compatible" content="IE=8" />
   <link href="css/bootstrap_cerulean.css" media="screen" rel="stylesheet" type="text/css" />
<style>
div.scroll
{
 
width:300px;
height:400px;
overflow:scroll;
}
 
div.hidden 
{
 
width:300px;
height:400px;
overflow:hidden;
}
</style>
 
<!--jqvmap custom JS-->
	<link href="css/jqvmap.css" media="screen" rel="stylesheet" type="text/css" />
	<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="js/jquery.vmap.js" type="text/javascript"></script>
    <script src="js/jquery.vmap.france.js" type="text/javascript"></script>
	<script src="js/jquery.vmap.colorsFrance.js" type="text/javascript"></script>
 
 
	$(document).ready(function() {
		$('#francemap').vectorMap({
		    map: 'france_fr',
			hoverOpacity: 0.5,
			hoverColor: false,
			backgroundColor: "#ffffff",
			colors: couleurs,
			borderColor: "#000000",
			selectedColor: "#EC0000",
			enableZoom: true,
			showTooltip: true,
		    onRegionClick: function(element, code, region)
		    {
		        var message = '?departement='
		            + region 
 
					+ '';
 
		 <!---->    open(message);
		 window.open(message,'_self');
		    }
		});
	});
 
 
 
 
	</script>
    </head>
 
  <body >
 
 
<!--div span--> <div class="span7">
<p>Pour vous mettre l&rsquo;eau à la bouche, voici le résultat :</p>
<div id="jvectormap" class="wp-caption aligncenter" style="width: 510px;">
<div id="francemap" style="border: 1px solid #aaaaaa; width: 500px; height: 400px;"></div>
</div>
</div><!-- fin div span-->
<!--div span--> <div class="span5" ><div class="scroll">
<h6 >ABLANCOURT </h6><h6 >SAINT-MARTIN-D\'ABLOIS </h6><h6 >AIGNY </h6><h6 >ALLEMANCHE-LAUNAY-ET-SOYER </h6><h6 >ALLEMANT </h6><h6 >ALLIANCELLES </h6><h6 >AMBONNAY </h6><h6 >AMBRIERES </h6><h6 >ANGLURE </h6><h6 >ANGLUZELLES-ET-COURCELLES </h6><h6 >ANTHENAY </h6><h6 >AOUGNY </h6><h6 >ARCIS-LE-PONSART </h6><h6 >ARGERS </h6><h6 >ARRIGNY </h6><h6 >ARZILLIERES-NEUVILLE </h6><h6 >ATHIS </h6><h6 >AUBERIVE </h6><h6 >AUBILLY </h6><h6 >AULNAY-L\'AITRE </h6><h6 >AULNAY-SUR-MARNE </h6><h6 >AUMENANCOURT </h6><h6 >AUVE </h6><h6 >AVENAY-VAL-D\'OR </h6><h6 >AVIZE </h6><h6 >AY </h6><h6 >BACONNES </h6><h6 >BAGNEUX </h6><h6 >LE BAIZIL </h6><h6 >BANNAY </h6><h6 >BANNES </h6><h6 >BARBONNE-FAYEL </h6><h6 >BASLIEUX-LES-FISMES </h6><h6 >BASLIEUX-SOUS-CHATILLON </h6><h6 >BASSU </h6><h6 >BASSUET </h6><h6 >BAUDEMENT </h6><h6 >BAYE </h6><h6 >BAZANCOURT </h6><h6 >BEAUMONT-SUR-VESLE </h6><h6 >BEAUNAY </h6><h6 >BEINE-NAUROY </h6><h6 >BELVAL-EN-ARGONNE </h6><h6 >BELVAL-SOUS-CHATILLON </h6><h6 >BERGERES-LES-VERTUS </h6><h6 >BERGERES-SOUS-MONTMIRAIL </h6><h6 >BERMERICOURT </h6><h6 >BERRU </h6><h6 >BERZIEUX </h6><h6 >BETHENIVILLE </h6><h6 >BETHENY </h6><h6 >BETHON </h6><h6 >BETTANCOURT-LA-LONGUE </h6><h6 >BEZANNES </h6><h6 >BIGNICOURT-SUR-MARNE </h6><h6 >BIGNICOURT-SUR-SAULX </h6><h6 >BILLY-LE-GRAND </h6><h6 >BINARVILLE </h6><h6 >BINSON-ET-ORQUIGNY </h6><h6 >BISSEUIL </h6><h6 >BLACY </h6><h6 >BLAISE-SOUS-ARZILLIERES </h6><h6 >BLESME </h6><h6 >BLIGNY </h6><h6 >BOISSY-LE-REPOS </h6><h6 >BOUCHY-SAINT-GENEST </h6><h6 >BOUILLY </h6><h6 >BOULEUSE </h6><h6 >BOULT-SUR-SUIPPE </h6><h6 >BOURGOGNE </h6><h6 >BOURSAULT </h6><h6 >BOUVANCOURT </h6><h6 >BOUY </h6><h6 >BOUZY </h6><h6 >BRANDONVILLERS </h6><h6 >BRANSCOURT </h6><h6 >BRAUX-SAINTE-COHIERE </h6><h6 >BRAUX-SAINT-REMY </h6><h6 >BREBAN </h6><h6 >LE BREUIL </h6><h6 >BREUIL </h6>
</div><!--fin div row fluid-->
</div>
 
 
  </body>
 
</html>

( j'ai enlevé des villes du code source , c'etait trops long )

si je clique sur un departement avec une apostrophe ( Côte d'Armor par exemple )

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
<!DOCTYPE html>
<html lang="fr">
  <head>
   <meta charset="utf-8" />
   <meta http-equiv="X-UA-Compatible" content="IE=8" />
   <link href="bootstrap_cerulean.css" media="screen" rel="stylesheet" type="text/css" />
 
 
 
 
 
<style>
div.scroll
{
 
width:300px;
height:400px;
overflow:scroll;
}
 
div.hidden 
{
 
width:300px;
height:400px;
overflow:hidden;
}
</style>
 
<!--jqvmap custom JS-->
	<link href="css/jqvmap.css" media="screen" rel="stylesheet" type="text/css" />
	<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="js/jquery.vmap.js" type="text/javascript"></script>
    <script src="js/jquery.vmap.france.js" type="text/javascript"></script>
	<script src="js/jquery.vmap.colorsFrance.js" type="text/javascript"></script>
 
	<script type="text/javascript">
 
 
	$(document).ready(function() {
		$('#francemap').vectorMap({
		    map: 'france_fr',
			hoverOpacity: 0.5,
			hoverColor: false,
			backgroundColor: "#ffffff",
			colors: couleurs,
			borderColor: "#000000",
			selectedColor: "#EC0000",
			enableZoom: true,
			showTooltip: true,
		    onRegionClick: function(element, code, region)
		    {
		        var message = '?departement='
		            + region 
 
					+ '';
 
		 <!---->    open(message);
		 window.open(message,'_self');
		    }
		});
	});
 
 
 
 
	</script>
    </head>
 
  <body >
 
 
<!--div span--> <div class="span7">
<p>Pour vous mettre l&rsquo;eau à la bouche, voici le résultat :</p>
<div id="jvectormap" class="wp-caption aligncenter" style="width: 510px;">
<div id="francemap" style="border: 1px solid #aaaaaa; width: 500px; height: 400px;"></div>
</div>
</div><!-- fin div span-->
<!--div span--> <div class="span5" ><div class="scroll">
Une erreur est survenue lors de la requete
</div><!--fin div row fluid-->
</div>
 
 
  </body>
 
</html>

peut etre dois je passer par une requete preparé, ça arrangerait le probleme ?

merci du coup de main

**SpaceFrog** · 14/11/2012, 08h41

L'erreur se situe donc coté php et mysql, pas coté javascript ...

Une erreur est survenue lors de la requete

La question aurait du être posée dans le salon php mysql ...

Code :

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

WHERE  t.nom LIKE '%".$departement."%' ");

si tu as une apostrophe dans ta variable que va-t-il se passer ???

ton string de requete sql aura un souci avec les quotes

Code :

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

LIKE '%cotes d'armor%'

c'est donc là qu'il faut échapper l'apostrophe ...

**serna** · 14/11/2012, 10h53

oui en effet ça concerne plus le php/mysql

bon j'ai trouvé un autre moyen car ça me prend le choux

je fais ma requête en m’appuyant sur d'un coté le numéro de département de la table "département" et de l'autre les deux premier numéro insee de ma table "commune" comme ça by by les slah et anti slash..

je rajoute ça dans ma requête

Code :

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

SUBSTR( uht.insee, 1, 2 )

merci spacefrog de m'avoir répondu

**SpaceFrog** · 14/11/2012, 11h26

ben y'avais vraiement rein de compliqué...

Code :

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

WHERE  t.nom LIKE '%".addsalshes($departement)."%' ");

ou

WHERE t.nom LIKE '%".mysql_real_escape($departement)."%' ");

Apostrophe jQuery MySQL

jQuery

Discussions similaires

Partager

Partager