[AJAX] Conflit entre 2 listes déroulantes

**ShunC** · 21/10/2013, 12h32

Bonjour,

J'appelle à l'aide car je ne m'en sors pas et cela commence à me décourager alors que je suis sûre que c'est un truc bénin. Mais pour le résoudre il me faut des yeux neufs sur mon code.

Je vous explique : je fais un back-office pour de l'archéologie. J'ai créé des personnes dans ma base via ce back-office. Une personne a obligatoirement 1 nom, 1 prénom, 1 email, 1 profession et 1 date de naissance. Facultativement, 1 adresse, 1 téléphone et une ville. La profession et la ville sont à choisir dans une liste déroulante. Jusque là, j'espère ne pas vous avoir perdu !?

Mon soucis commence : la création se fait correctement. Mais quand je choisis une des personnes pour vérifier si je récupère bien les informations saisies précédemment ou pour modifier (comme dans un cas standard de back-office), ma liste déroulante de professions s'alimente avec les villes comme ma liste déroulante de villes......

N.B. : A la validation de création d'une personne, je choisis au hasard une ville si elle n'a pas été sélectionnée (pour des raisons de facilité).

Voici mon code quand je choisis une personne :

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
function Choisir(chx, quoi)
{
	a=getxhr();
	a.open("POST","../php/choisir.php",true);
	a.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	a.onreadystatechange = function()
	    { 
	        if(a.readyState  == 4)
	        {
	            if(a.status  == 200)	
				{					
					result=a.responseText.split(';');
					switch (quoi)
					{
						case "Cate" :
							divf='<form method="post"><label for="idca">Identifiant : </label><input id="idca" type="text" readonly="readonly" name="idca" value="'+result[0]+'"/><br/><br/>';
							divf+='<label for="nomca">Nom : </label><input id="noca" type="text" name="ncat" value="'+result[1]+'"/>';
							divf+='</form>';
							break;
						case "Conse" :
							divf='<form method="post"><label for="idco">Identifiant : </label><input id="idco" type="text" readonly="readonly" name="idco" value="'+result[0]+'"/><br/><br/>';
							divf+='<label for="nomco">Nom : </label><input id="noco" type="text" name="ncons" value="'+result[1]+'"/>';
							divf+='</form>';
							break;
						case "Pays" :
							divf='<form method="post"><label for="niso">N° ISO : </label><input id="idp" type="text" readonly="readonly" name="numiso" value="'+result[0]+'"/><br/><br/>';
							divf+='<label for="siso">Sigle ISO : </label><input id="sigp" type="text" name="sgliso" value="'+result[1]+'"/><br/><br/>';
							divf+='<label for="nomp">Nom : </label><input id="nomp" type="text" name="npays" value="'+result[2]+'"/>';
							divf+='</form>';
							break;
						case "Pers" :
							divf='<form method="post"><label for="idpe">Identifiant : </label><input id="idpe" type="text" readonly="readonly" name="idpe" value="'+result[0]+'"/><br/><br/>';
							divf+='<label for="nompe">Nom : </label><input id="nope" type="text" name="npers" value="'+result[1]+'"/><br/><br/>';
							divf+='<label for="pnompe">Prénom : </label><input id="pnope" type="text" name="pnpers" value="'+result[2]+'"/><br/><br/>';
							divf+='<label for="pnompe">Email : </label><input id="emape" type="text" name="empers" value="'+result[6]+'"/><br/><br/>';
							divf+='<label for="nompr">Profession : </label>';
							divf+='<SELECT id="spro" name="nprof[]" onchange="this.options[this.selectedIndex].value">';
								getid("form").innerHTML=divf; //permet d'alimenter la liste des professions	
									//alert(result[10]);
								ListerProf(result[10]);
							divf+='</SELECT><br/><br/>';
							//divf+='<label for="nompr">Profession : </label><input id="nopr" type="text" name="nprof" value="'+result[9]+'"/><br/><br/>';
							divf+='<label for="ddnpe">Né(e) le : </label><input id="ddnpe" type="text" name="ddnpers" value="'+result[3]+'"/><br/><br/>';
							divf+='<label for="telpe">Téléphone : </label><input id="telpe" type="text" name="telpers" value="'+result[4]+'"/><br/><br/>';
							divf+='<label for="adrpe">Adresse : </label><input id="adrpe" type="text" name="adrpers" value="'+result[5]+'"/><br/><br/>';
							divf+='<label for="cpv">CP : </label><input id="cpv" type="text" name="cpv" value="'+result[7]+'" onchange="RecupererVille(0)"/><br/><br/>';
							divf+='<label for="nomv">Ville : </label><select id="novi" name="nvil[]">';
								getid("form").innerHTML=divf; //permet d'alimenter la liste des villes
								RecupererVille(result[8]);
							divf+='</select><br/><br/>';
							//divf+='<label for="cpv">CP : </label><input id="cpv" type="text" name="cpv" value="'+result[7]+'"/><br/><br/>';
							//divf+='<label for="nomv">Ville : </label><input id="novi" type="text" name="nvil" value="'+result[8]+'"/>';	
							divf+='</form>';
							break;
						case "Prof" :
							divf='<form method="post"><label for="idpr">Identifiant : </label><input id="idpr" type="text" readonly="readonly" name="idpr" value="'+result[0]+'"/><br/><br/>';
							divf+='<label for="nompr">Nom : </label><input id="nopr" type="text" name="nprof" value="'+result[1]+'"/>';
							divf+='</form>';
							break;						
					}
 
					getid("btn_mod").disabled=false;
					getid("btn_sup").disabled=false;
					getid("btn_crt").disabled=true;
					getid("form").innerHTML=divf;
	            }
				else 
	                alert("Error code " + a.status);
	        }
	    };
	a.send("chx="+chx+"&obj="+quoi);
}

Le code pour la liste déroulante des villes :

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
function RecupererVille(nb)
{
	a=getxhr();
	a.open("POST","../php/recuperer_ville.php",true);
	a.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	a.onreadystatechange = function()
	{ 
		if(a.readyState  == 4)
		{
			if(a.status  == 200)	
			{		
				if (a.responseText!="-1")
				{
					result=a.responseText.split('*');
					if (nb==0)
					{
						getid('novi').innerHTML='<OPTION value="0" SELECTED>Sélectionner une ville';
					}
					for(i=0;i<result.length-1;i++)
					{
						enreg=result[i].split(';');
 
						if (nb==enreg[0])
						{
							getid('novi').innerHTML+='<OPTION value="'+enreg[0]+'" SELECTED>'+enreg[1];
						}
						else
						{
							getid('novi').innerHTML+='<OPTION value="'+enreg[0]+'">'+enreg[1];
						}
					}
				}
				else
				{
					alert ("Le code postal n'existe pas.");
				}
			}
			else 
				alert("Error code " + a.status);
		}
	};
	a.send("cp="+getid('cpv').value);
 
}

Le code de la liste déroulante des professions :

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
function ListerProf(id)
{
	alert('id : '+id);
	a=getxhr();
	a.open("POST","../php/lister_prof.php",true);
	a.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
	a.onreadystatechange = function()
	{
		alert ('state : '+a.readyState);
		if(a.readyState == 4)
		{
			if(a.status == 200)
			{
				alert ('response : '+a.responseText);
				if (a.responseText!="-1")
				{
					result=a.responseText.split('*');
					if (id==0)
					{
						getid('spro').innerHTML='<OPTION value="0" SELECTED>Sélectionner une profession';
					}
					for(i=0;i<result.length-1;i++)
					{
						enreg=result[i].split(';');
						alert ('enreg :'+enreg[0]);
						if (id==enreg[0])
						{
							getid('spro').innerHTML+='<OPTION value="'+enreg[0]+'" SELECTED>'+enreg[1];
						}
						else
						{
							getid('spro').innerHTML+='<OPTION value="'+enreg[0]+'">'+enreg[1];
						}
					}
				}
				else
				{
					alert ("Aucune profession a été créée.");
				}
			}
			else
				alert("Error code " + a.status);
		}
	};
	a.send();
}

Merci de m'avoir lue et par avance merci de vos réponses.

**sk8matt** · 22/10/2013, 11h28

Bonjour,

Alors avec le code source que tu donne tel quel il ne semble pas y avoir de problème.

Si ta liste s'alimente mais pas avec les bonnes données c'est qu'il semblerais que tu n'est pas modifié un de tes copier/coller.

recuperer_ville.php
lister_prof.php

A tu la possibilité d'afficher le code de ces pages ? J'aurais tendance à penser que les requêtes SQL associées à tes deux pages sont les même et liste les villes.

**ShunC** · 22/10/2013, 13h11

Mes deux pages php récupèrent bien des choses différentes car lors de la création de la personne, elles fonctionnent mais je poste sans soucis leur code.

recuperer_ville.php :

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
<?php
	if (isset($_POST['cp']) && !empty($_POST['cp']))
	{
		$trouve=false;
		$ma_bd=new PDO('mysql:host=localhost;dbname=archeo','root','');
		$ma_bd->exec("SET NAMES UTF8");
		$req="SELECT * FROM villes WHERE cp LIKE '".$_POST['cp']."%' ORDER BY nomVille ASC";
		try
		{
			foreach($ma_bd->query($req) as $vil)
			{
				echo $vil['idVille'].";".$vil['nomVille']."*";
				$trouve=true;
			}
			$ma_bd=null;
		}
		catch(Exception $e)
		{
			echo 'Exception reçue',  $e->getMessage(), "\n";
		}
		if (!$trouve)
		{
			echo "-1";
		}
	}
?>

lister_prof.php :

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
<?php
	$trouve=false;
	$ma_bd=new PDO('mysql:host=localhost;dbname=archeo','root','');
	$ma_bd->exec("SET NAMES UTF8");
	$req="SELECT * FROM professions ORDER BY nomProfession ASC";
	try
	{
		foreach($ma_bd->query($req) as $prof)
		{
			echo $prof['idProfession'].";".$prof['nomProfession']."*";
			$trouve=true;
		}
		$ma_bd=null;
	}
	catch(Exception $e)
	{
		echo 'Exception reçue',  $e->getMessage(), "\n";
	}
	if (!$trouve)
	{
		echo "-1";
	}
?>

**Golgotha** · 25/10/2013, 16h15

Bonjour,

Plusieurs points de contrôle :

- Tester RecupererVille() sans rien d'autre en test unitaire.
- Tester Choisir() en test unitaire (avec tout les cas du case).

- RecupererVille est il ok ?
- Choisir est il ok ?

- Cas non ok ?

**ShunC** · 25/10/2013, 16h42

Tout est ok.

Le cas qui ne fonctionne pas est quand je choisis une personne (=> case "Pers") pour pouvoir modifier un de ses attributs, la liste déroulante des professions s'alimente avec la liste des villes au lieu de la liste des professions.

lister_prof fonctionne également car elle est appelée quand je crée une personne et tout est correcte.

Mes formulaires de création et de modification sont les mêmes : ils contiennent les mêmes éléments mais alimentés soit à vide pour la création soit avec la base de données en modification.

**Golgotha** · 25/10/2013, 17h00

Dans ce cas,

Breakpoint sur : result=a.responseText.split(';');
Valeur de result? (si 'quoi' = 'Pers')

**ShunC** · 25/10/2013, 17h16

si quoi = 'pers'
result =" idPers;nomPers;pnomPers;ddnPers;telPers;adrPers;emailPers;cpVil;idVil;nomProf;idProf".

**Golgotha** · 25/10/2013, 18h07

ça c'est le fonctionnelle, pas un cas concret, donne moi le résultat de la variable quand ça déconne, sinon on va pas avancer..

**ShunC** · 25/10/2013, 18h24

6,Adamn,Jean-Pierre,0000-00-00,,,jp.adamn@yahoo.fr,56690,21652,Anthropologue,1

Voilà ce que j'ai dans result actuellement (ma liste déroulante des professions ne s'alimente pas ou avec les villes ayant le même code postal présent dans result)

**Golgotha** · 25/10/2013, 21h26

Dans ton code tu as plusieurs fois a=getxhr();.

Peut tu mettre var devant et changer de nom de variable dans chaque fonction, histoire d'être sûr que ça ne pose aucun problème.

var ajx_recupVille = getxhr();
var ajx_choisir = getxhr();
...

**ShunC** · 26/10/2013, 01h51

Golgotha, you are my God !!!!!!

Cela fonctionne !! ^^ (essai rapide avant d'aller dormir, je regarderai cela plus amplement après une bonne nuit)

Je mets en résolu mais attention au retour éventuel !!

**Golgotha** · 26/10/2013, 20h56

[AJAX] Conflit entre 2 listes déroulantes

AJAX

Discussions similaires

Partager

Partager