Sujet Précédent Sujet Suivant

Récupération de données via un formulaire

Fermé
Hefthyn - Modifié par jordane45 le 22/12/2014 à 10:10
Hefthyn Messages postés 6 Date d'inscription dimanche 21 décembre 2014 Statut Membre Dernière intervention 1 février 2015 - 4 janv. 2015 à 14:48
Bonjour,

Je me retrouve face à un problème assez complexe pour moi qui suit débutant en Javascript. Je vous expose mon problème.

J'aimerai afficher sur un google map des informations (markers) en fonction de certaines données de ma base de données. La selection de ces données passeraient par un formulaire qui déterminerait les closes where de ma requête SQL. Voila pour le gros de l'idée, maintenant les détails.


J'ai 3 pages :
- celle avec le formulaire définissant les closes Where (page 1)
- celle qui récupère les données depuis ma base (page 2)
- celle avec la carte google (page 3)

Ma page 1 n'est qu'un simple formulaire qui renvoie pour l'instant les données entrées sur la page 2. Ainsi je suis capable de construire ma requête proprement.

Ma page 2 est une page qui se connecte à la base de données, construit ma requête et converti le résultat en JSON et l'affiche à l'aide d'echo.

Ma page 3 est une version modifiée du code présent ici : https://developers-dot-devsite-v2-prod.appspot.com/maps/documentation/javascript/examples/infowindow-simple
J'ai en fait rajouté un XMLRequest afin de pouvoir récupérer les informations que me renvoie la page 2. Le code que j'ai utilisé est le premier encadré de cette page http://youmightnotneedjquery.com/#json. Une fois les informations récupérées je les ai parsées avec un JSON.parse().

Maintenant vient à moi deux problèmes, l'un technique l'autre conceptuel.

Le conceptuel :
Actuellement ma page 1 ne sert à rien car lorsque je récupère les données depuis ma page 3, toutes les informations envoyées par la page 1 ne sont pas prises en compte. Je me retrouve donc en gros avec mon select * from ma_table.
Devrai-je envoyer les informations à ma page 3 et appeler ma page 2 avec ces données dans l'URL afin de bien en tenir compte dans ma requête ?

Le technique :
Plus rien ne se passe après que j'ai parsé le JSON, j'en conclu qu'il y a eu une erreur lors du parsage du JSON ce qui bloque la suite de l'exécution.

Voici ce que j'obtiens comme page HTML lorsque j'affiche ma page 2 : 
<html>
<head></head>
<body>[{"SIRET": "12457893187957", "departement": "dep 1", "localite": "0", "institution": "instit 1", "adresse": "156 rue", "CP": "34790", "E_APA": "test 1", "responsable": "resp 1", "telephone": "457896587", "long": "0", "lat": "0}, {"SIRET": "21457895235874", "departement": "dep 2", "localite": "0", "institution": "instit 2", "adresse": "158 reu", "CP": "34878", "E_APA": "test 2", "responsable": "resp 2", "telephone": "2257898722", "long": "0", "lat": "0}]
</body>
</html>

Voici ce que j'ai écris pour récupérer ces informations : 
request = new XMLHttpRequest();
 request.open('GET', "mon_chemin_en_localhost", true);

 request.onload = function() {
  if (request.status >= 200 && request.status < 400){ 
   // Success!
     data = JSON.parse(request.responseText);
  } 
  else {
   alert("Erreur avec la connexion au serveur, merci de contacter un admin");
  }
 };

J'ai vérifier, l'accès à la page est bon et le readyState est égal à 4.

Si vous avez besoin de plus d'informations, je peux en fournir, je ne sais pas si c'est suffisant.

Merci d'avance.

4 réponses

Réponse 1 / 4
jordane45 Messages postés 38369 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 3 janvier 2025 4 721
22 déc. 2014 à 10:12
Bonjour,

Je pense qu'un aperçu du code de tes pages .. pourrait nous aider à mieux comprendre ton souci.

PS:Merci de bien vouloir utiliser la coloration syntaxique (les balises de code) lorsque tu postes du code sur le forum.
Explications disponibles ici :
https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

0
Réponse 2 / 4
Hefthyn Messages postés 6 Date d'inscription dimanche 21 décembre 2014 Statut Membre Dernière intervention 1 février 2015
22 déc. 2014 à 23:25
D'accord.

Voici là page 2 : 

<?php       
$connexion = new PDO("mysql:host=localhost" . ';dbname=' . "nom_ma_base", "user_ma_base", "mdp_ma_base");

$sql = 'SELECT * FROM institution';    
$req = $connexion->query($sql);

echo "[";

$row = $req->fetch();
if (!is_null($row))
{
echo "{";   
echo "\"SIRET\": "; echo "\""; echo $row['SIRET']; echo "\", ";
echo "\"departement\": "; echo "\""; echo $row['departement']; echo "\", ";
echo "\"localite\": "; echo "\""; echo $row['localite'] + ","; echo "\", ";
echo "\"institution\": "; echo "\""; echo $row['institution']; echo "\", ";
echo "\"adresse\": "; echo "\""; echo $row['adresse']; echo "\", ";
echo "\"CP\": "; echo "\""; echo $row['CP']; echo "\", ";
echo "\"E_APA\": "; echo "\""; echo $row['E_APA']; echo "\", ";
echo "\"responsable\": "; echo "\""; echo $row['responsable']; echo "\", ";
echo "\"telephone\": "; echo "\""; echo $row['telephone']; echo "\", ";
echo "\"long\": "; echo "\""; echo $row['long']; echo "\", ";
echo "\"lat\": "; echo "\""; echo $row['lat'];
echo "}";
}
while($row = $req->fetch()) {
echo ", {";   
echo "\"SIRET\": "; echo "\""; echo $row['SIRET']; echo "\", ";
echo "\"departement\": "; echo "\""; echo $row['departement']; echo "\", ";
echo "\"localite\": "; echo "\""; echo $row['localite'] + ","; echo "\", ";
echo "\"institution\": "; echo "\""; echo $row['institution']; echo "\", ";
echo "\"adresse\": "; echo "\""; echo $row['adresse']; echo "\", ";
echo "\"CP\": "; echo "\""; echo $row['CP']; echo "\", ";
echo "\"E_APA\": "; echo "\""; echo $row['E_APA']; echo "\", ";
echo "\"responsable\": "; echo "\""; echo $row['responsable']; echo "\", ";
echo "\"telephone\": "; echo "\""; echo $row['telephone']; echo "\", ";
echo "\"long\": "; echo "\""; echo $row['long']; echo "\", ";
echo "\"lat\": "; echo "\""; echo $row['lat'];
echo "}";
} 
echo "]";
?>


Page 3 :
J'ai déjà écris le code utile, mais le voici en version complète : 
<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Info windows</title>
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px
      }
    </style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
// This example displays a marker at the center of Australia.
// When the user clicks the marker, an info window opens.


function initialize() {
    var myLatlng = new google.maps.LatLng(-25.363882,131.044922);
    var mapOptions = {
		zoom: 4,
    	center: myLatlng
	};
	
	request = new XMLHttpRequest();
	request.open('GET', "http://localhost/papa/co.php", true);

	request.onload = function() {
		if (request.status >= 200 && request.status < 400){ 
			// Success!
		  	data = JSON.parse(request.responseText);
		} 
		else {
			alert("Erreur avec la connexion au serveur, merci de contacter un admin");
		}
	};
	
	request.onerror = function() {
	  // There was a connection error of some sort
	};

	request.send();
	
	// Traitement
	var contentString = "mon texte";
	var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
	
	var infowindow = new google.maps.InfoWindow({
	    content: contentString
	});
	
	var marker = new google.maps.Marker({
	    position: myLatlng,
	    map: map,
	    title: 'Uluru (Ayers Rock)'
	});
	
	google.maps.event.addListener(marker, 'click', function() {
		infowindow.open(map,marker);
	});

}

google.maps.event.addDomListener(window, 'load', initialize);
    </script>
</head>
  
  <body>	
    <div id="map-canvas"></div>
  </body>
  
</html>
0
Réponse 3 / 4
jordane45 Messages postés 38369 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 3 janvier 2025 4 721
23 déc. 2014 à 10:17
Bonjour,

Je vois... tu "fabriques" ton json.....
Que penses tu la fonction php : json_encode() ? 

<?php       
$connexion = new PDO("mysql:host=localhost" . ';dbname=' . "nom_ma_base", "user_ma_base", "mdp_ma_base");

$sql = 'SELECT * FROM institution';    
$req = $connexion->query($sql);

$result = array();
$result = $req->fetchAll();

echo json_encode($result);

?>

0
Réponse 4 / 4
Hefthyn Messages postés 6 Date d'inscription dimanche 21 décembre 2014 Statut Membre Dernière intervention 1 février 2015
4 janv. 2015 à 14:48
Désolé de répondre si tardivement, j'étais en vacances de Noël.

Je te remercie grandement pour ta réponse, tu as résolu mon soucis de JSON !

Aurais tu / Auriez vous une idée pour résoudre mon soucis de requête personnalisée à partir d'un formulaire et récupérable par une page tierce ?
0

Discussions similaires

Je n'arrive plus à récuperer mon compte Outlook
gnulinux_ -
laure -

4 réponses
Colis shein terminal fret
Lele -
bazfile -

1 réponse
Erreur la zone de données passée à un appel système est insu
Vincent -
Panth33ra -

5 réponses
High Sierra : refus de réinstallation "serveur pas contacté"
pgwz132 -
pgwz132 -

2 réponses