Discussion :

[kenotte]

Bonjour a tous,

Je suis étudiante en informatique mais encore novice, actuellement je suis en stage et je travaille sur un projet dans lequel dois pouvoir a partir d'une sélection dans une liste déroulante (que j'ai généré a partir de ma bdd) remplir automatiquement mon formulaire sans que la page se réactualise.

Pour faire simple j'aimerai en sélectionnant une personne dans ma liste déroulante que toute les informations la concernant (nom, adresse, téléphone...) apparaissent.

Il va de soit que je doit utilisé l'ajax et le java script, mais malheureusement malgré mais multiples tentatives j'arrive seulement à retourné la valeur "<gras>undefined</gras>" dans mes champs de texte pour mozilla, et rien du tout pour ie.

Voila mon code :

Code :

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

<select size="1" name="parentb" id="parentb" onchange="envoyerRequeteParentb(this.value, 'parentbis.php');">

Voila la requête envoyé via l'url :

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
 
<?php
//connexion à la base
	include ('connect_bdd.php') ;
 
	header("Cache-Control: no-cache, must-revalidate");//ceci oblige le navigateur à exectuer un script à chaque appel au lieu d'utiliser l'information présente dans son cache
	header('Content-Type: text/plain; charset=ISO-8859-1');
 
	if (isset($_POST['code']) && ($_POST['code'])!='') 
		{	
			$code=$_POST['code'];
		}
		else
		{
			$code="%";
		}
 
	//mise en place de la requete sql
			$req=mysql_query("SELECT nomparentb, prenomparentb, adressepb, cpparentb, villeparentb, fixepb, portpb
								FROM parentbis
								WHERE codeparentbis = '$code'");
			$pdt=mysql_fetch_assoc($req) or die(mysql_error());//mysql_fetch_assoc = mysql_fetch_array 
			if ($pdt)
			{
				$resultat=$pdt['nomparentb'].'*'.$pdt['prenomparentb'].'*'.$pdt['adressepb'].'*'.$pdt['cpparentb'].'*'.$pdt['villeparentb'].'*'.$pdt['fixepb'].'*'.$pdt['portpb'];
				$pdt=mysql_fetch_assoc($req);
			}
			else
			{
				$resultat='';
			}
 
			while ($pdt)
			{
				$resultat=$pdt['nomparentb'].'*'.$pdt['prenomparentb'].'*'.$pdt['adressepb'].'*'.$pdt['cpparentb'].'*'.$pdt['villeparentb'].'*'.$pdt['fixepb'].'*'.$pdt['portpb'];
				$pdt=mysql_fetch_assoc($req);
			}
 
		echo $resultat;
?>

La fonction ajax appelé et celles qui en découlent :

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
 
function envoyerRequeteParentb (code, url)
{
 
	//appel de la fonction getRequeteHttp pour obtenir un objet XMLHttpRequest
	var requeteHttp=getRequeteHttp();
	//une fois objet obtenu, on teste la valeur de l'objet
 
	if (code != 'aucun' && code != 'effacer' && code != 'new')
	{
		if (requeteHttp==null)
		{
			alert("Impossible d'utiliser Ajax sur ce navigateur");
		}
		else  // si la valeur incite a continuer...
		{
			if(navigator.appName == 'Microsoft Internet Explorer')
			{
			requeteHttp.open('POST',url,true);//... on ouvre la requete en parametrant la methode d'envoi des données au serveur, l'url de la page appelée, le mode d'appel (synchrone=false ou asynchrone=true) 
			requeteHttp.onreadystatechange=function() {recevoirReponseparentb(requeteHttp);};//...on utilise une fonction dite de callback : on envoie la requete en indiquant le nom de la fonction a appeler lorsque le resultat sera arrivé ; cela permet de ne pas attendre le resultat pour continuer.(necessaire en asynchrone)
			requeteHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');// syntaxe necessaire pour la methode post : il faut parametrer l'en-tete utilisé par la requete
			requeteHttp.send('code ='+escape(code));//...enfin on envoie la requete
			}
			else
			{
				requeteHttp.open('POST',url,false);//... on ouvre la requete en parametrant la methode d'envoi des données au serveur, l'url de la page appelée, le mode d'appel (synchrone=false ou asynchrone=true) 
				requeteHttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');// syntaxe necessaire pour la methode post : il faut parametrer l'en-tete utilisé par la requete
				requeteHttp.send('code ='+ escape(code));//...enfin on envoie la requete
				traiterReponseparentb(requeteHttp.responseText);//appel de la fonction traiter réponse
			}
		}
	}
	else
	{
		document.getElementById("nomr").value ='';
		document.getElementById("prenomr").value ='';
		document.getElementById("adresser").value ='';
		document.getElementById("cpr").value ='';
		document.getElementById("viller").value ='';
		document.getElementById("fixer").value ='';
		document.getElementById("portr").value ='';
	}
	return;
}
 
 
function recevoirReponseparentb(requeteHttp)
// lorsque envoyerRequete se termine, le navigateur n'est pas figé. Donc, quand  l'evenement onreadystatechange se produit,  ie quand la propriété readystate=etat d'avancement de l'objet requeteHttp change de valeur (0=non initialisé, 1=en cours de chargement, 2=chargé, 3=interaction en cours, 4=requete terminée) , alors la fonction recevoir Reponse est appelée
{
	//Quand la requete est terminée...
	if (requeteHttp.readyState==4)
	{
		// on regarde le statut du deroulement de la requete ; la valeur 200 correspond a un bon deroulement, 404 a une page non trouvée...
		if (requeteHttp.status==200)
		{
 
			traiterReponseparentb(requeteHttp.responseText);//appel de la fonction traiter réponse
		}
		else
		{
			alert("Erreur "+requeteHttp.status+" : la requête ne s'est pas correctement exécutée.");
		}
	}
}
 
 
function traiterReponseparentb(reponse)
//fonction qui traite la reponse de la requete
{
 
	var i,nb, temp;
	var saisie=reponse.split('*');//les resultats de la requete sont concaténés et separés par des * il est donc necessaire de deconcatener grace a la fonction split; celle-ci retourne un tableau de sous chaine de caractères  en utilisant comme séparateur le motif qui suit.
	nb=saisie.length; // on connait ainsi la longueur du tableau
 
for (i=0; i<nb; i++)
	{
			elt=saisie[i].split('*');
 
			document.getElementById("nomr").value=elt[1];
			document.getElementById("prenomr").value=elt[2];
			document.getElementById("adresser").value=elt[3];
			document.getElementById("cpr").value=elt[4];
			document.getElementById("viller").value=elt[5];
			document.getElementById("fixer").value=elt[6];
			document.getElementById("portr").value=elt[7];
	}
}

Je suis désolé j'ai mis beaucoup de code mais ça me semble important pour une meilleur compréhension et pour facilité la correction.

Si quelqu'un pouvais m'aider je lui serait très reconnaissante !

[E.Bzz]

Bonjour et bienvenu sur Developpez.com

Je pense que ta réponse est dans ton code

//les resultats de la requete sont concaténés et separés par des * il est donc necessaire de deconcatener grace a la fonction split; celle-ci retourne un tableau de sous chaine de caractères en utilisant comme séparateur le motif qui suit.

Seulement, toi tu split() deux fois de suite : une fois à la ligne dont le commentaire est reproduit ci-dessus, puis une nouvelle fois dans la boucle (sur chaque élément du tableau).
Le second est de trop

Récupère les infos directement à partir de ton premier tableau (saisie).
Tu n'as pas besoin de "elt" ...

A+

[kenotte]

bonjour,

je suis désolé de ne répondre que maintenant, ayant eu des vacances au milieu de ma période de stage, j'ai mis un peu tous sa de coté.

Alors E.Bzz merci pour ton aide j'ai rectifié se que tu m'a dit mais apparemment j'ai une autre erreur je pense qu'elle se trouve dans ma requête, qui m'a tout l'aire de ne me retourné aucun résultat. Ce que confirme d'ailleurs Firebug.

[E.Bzz]

apparemment j'ai une autre erreur je pense qu'elle se trouve dans ma requête, qui m'a tout l'aire de ne me retourné aucun résultat. Ce que confirme d'ailleurs Firebug.

Tu as pu résoudre ce problème ?

A+