[AJAX] Demande conseil sur sélection ElementById

**francky74** · 14/03/2015, 13h04

Bonjour,

J'ai fait un code qui a pour but d'inscrire des valeur (value) dans de nombreux champs cachés.

Il y a un code ajax qui renvoie vers du php.

mon code fonctionne mais je me demande s'il n'y a pas un moyen plus court (en ligne de programmation) afin de réaliser les mêmes tâches.

Car dans le code en AJAX, j'ai besoin de récupérer les Elements en focntion de leur Id. Pour ce faire j'ai démultiplié les getElementById autant de fois que j'avais besoin de récupérer un élément. Comme vous pouvez le voir dans le code qui suit :

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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
//click sur une ligne du tableau des particuliers ou des entreprises pour remplir les champs et les hidden champs
function remplichamps(type, id, obj)
{
	if (type == "personnes")
	{
	  if (window.XMLHttpRequest) {
		    // code for IE7+, Firefox, Chrome, Opera, Safari
		    xmlhttp=new XMLHttpRequest();
		    xmlhttp2=new XMLHttpRequest();
		    xmlhttp3=new XMLHttpRequest();
		    xmlhttp4=new XMLHttpRequest();
		    xmlhttp5=new XMLHttpRequest();
		    xmlhttp6=new XMLHttpRequest();
		    xmlhttp7=new XMLHttpRequest();
	  } else {  // code for IE6, IE5
		    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp3=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp4=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp5=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp6=new ActiveXObject("Microsoft.XMLHTTP");
		    xmlhttp7=new ActiveXObject("Microsoft.XMLHTTP");
	  }
	  /////////////////////////////////////////////////////////////////
	  xmlhttp.onreadystatechange=function()
		{
		    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
		      document.getElementById("divpersh").innerHTML = xmlhttp.responseText;
		    }
		}
 
		  xmlhttp.open("GET","affichchamps.php?id="+ id + "&type=" + type,true);
		  xmlhttp.send();
		//////////////////////////////////////////////////////////// 
	  xmlhttp2.onreadystatechange=function()
		{
		    if (xmlhttp2.readyState==4 && xmlhttp2.status==200) {
		      document.getElementById("hidsexe").value = xmlhttp2.responseText;
		    }
		}
	  xmlhttp2.open("GET", "remplihidsexeparticulier.php?id=" + id, true);
	  xmlhttp2.send();
	  ///////////////////////////////////////////////////////////////////////////////
	  xmlhttp3.onreadystatechange=function()
		{
		    if (xmlhttp3.readyState==4 && xmlhttp3.status==200) {
		      document.getElementById("hidnom").value = xmlhttp3.responseText;
		    }
		}
 
	  xmlhttp3.open("GET","remplihidnomparticulier.php?id="+ id,true);
	  xmlhttp3.send();
 
	  ///////////////////////////////////////////////////////////////////////////////
	  xmlhttp4.onreadystatechange=function()
		{
		    if (xmlhttp4.readyState==4 && xmlhttp4.status==200) {
		      document.getElementById("hidprenom").value = xmlhttp4.responseText;
		    }
		}
 
	  xmlhttp4.open("GET","remplihidprenomparticulier.php?id="+ id,true);
	  xmlhttp4.send();
 
	  ///////////////////////////////////////////////////////////////////////////////
	  xmlhttp5.onreadystatechange=function()
		{
		    if (xmlhttp5.readyState==4 && xmlhttp5.status==200) {
		      document.getElementById("hiddatenaiss").value = xmlhttp5.responseText;
		    }
		}
 
	  xmlhttp5.open("GET","remplihiddatenaissparticulier.php?id="+ id,true);
	  xmlhttp5.send();
 
	  ///////////////////////////////////////////////////////////////////////////////
	  xmlhttp6.onreadystatechange=function()
		{
		    if (xmlhttp6.readyState==4 && xmlhttp6.status==200) {
		      document.getElementById("hidcommunenaiss").value = xmlhttp6.responseText;
		    }
		}
 
	  xmlhttp6.open("GET","remplihidcommunenaissparticulier.php?id="+ id,true);
	  xmlhttp6.send();
 
	  ///////////////////////////////////////////////////////////////////////////////
	  xmlhttp7.onreadystatechange=function()
		{
		    if (xmlhttp7.readyState==4 && xmlhttp7.status==200) {
		      document.getElementById("hiddeptnaiss").value = xmlhttp7.responseText;
		    }
		}
 
		  xmlhttp7.open("GET","remplihiddeptnaissparticulier.php?id="+ id,true);
		  xmlhttp7.send();
 
	}
 
	if (type == "entreprises")
	{
		  if (window.XMLHttpRequest) {
			    // code for IE7+, Firefox, Chrome, Opera, Safari
			    xmlhttp=new XMLHttpRequest();
			    xmlhttp2=new XMLHttpRequest();
			    xmlhttp3=new XMLHttpRequest();
			    xmlhttp4=new XMLHttpRequest();
			    xmlhttp5=new XMLHttpRequest();
			    xmlhttp6=new XMLHttpRequest();
			    xmlhttp7=new XMLHttpRequest();
		  } else {  // code for IE6, IE5
			    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp2=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp3=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp4=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp5=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp6=new ActiveXObject("Microsoft.XMLHTTP");
			    xmlhttp7=new ActiveXObject("Microsoft.XMLHTTP");
		  }
		  /////////////////////////////////////////////////////////////////
		  xmlhttp.onreadystatechange=function()
			{
			    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
			      document.getElementById("divpersh").innerHTML = xmlhttp.responseText;
			    }
			}
 
			  xmlhttp.open("GET","affichchamps.php?id="+ id + "&type=" + type,true);
			  xmlhttp.send();
			//////////////////////////////////////////////////////////// 
		  xmlhttp2.onreadystatechange=function()
			{
			    if (xmlhttp2.readyState==4 && xmlhttp2.status==200) {
			      document.getElementById("hiddesignation").value = xmlhttp2.responseText;
			    }
			}
		  xmlhttp2.open("GET", "remplihiddesignation.php?id=" + id, true);
		  xmlhttp2.send();
		  ///////////////////////////////////////////////////////////////////////////////
		  xmlhttp3.onreadystatechange=function()
			{
			    if (xmlhttp3.readyState==4 && xmlhttp3.status==200) {
			      document.getElementById("hidsiret").value = xmlhttp3.responseText;
			    }
			}
 
		  xmlhttp3.open("GET","remplihidsiret.php?id="+ id,true);
		  xmlhttp3.send();
 
		  ///////////////////////////////////////////////////////////////////////////////
		  xmlhttp4.onreadystatechange=function()
			{
			    if (xmlhttp4.readyState==4 && xmlhttp4.status==200) {
			      document.getElementById("hidstatut").value = xmlhttp4.responseText;
			    }
			}
 
		  xmlhttp4.open("GET","remplihidstatut.php?id="+ id,true);
		  xmlhttp4.send();
 
		  ///////////////////////////////////////////////////////////////////////////////
		  xmlhttp5.onreadystatechange=function()
			{
			    if (xmlhttp5.readyState==4 && xmlhttp5.status==200) {
			      document.getElementById("hidsexerep").value = xmlhttp5.responseText;
			    }
			}
 
		  xmlhttp5.open("GET","remplihidsexerep.php?id="+ id,true);
		  xmlhttp5.send();
 
		  ///////////////////////////////////////////////////////////////////////////////
		  xmlhttp6.onreadystatechange=function()
			{
			    if (xmlhttp6.readyState==4 && xmlhttp6.status==200) {
			      document.getElementById("hidnomrep").value = xmlhttp6.responseText;
			    }
			}
 
		  xmlhttp6.open("GET","remplihidnomrep.php?id="+ id,true);
		  xmlhttp6.send();
 
		  ///////////////////////////////////////////////////////////////////////////////
		  xmlhttp7.onreadystatechange=function()
			{
			    if (xmlhttp7.readyState==4 && xmlhttp7.status==200) {
			      document.getElementById("hidprenomrep").value = xmlhttp7.responseText;
			    }
			}
 
			  xmlhttp7.open("GET","remplihidprenomrep.php?id="+ id,true);
			  xmlhttp7.send();
	}
}

et après chaque récupération d'élément, le code renvoie vers un fichier PHP. Ce qui me fait donc de nombreux fichiers dans mes dossiers. Et je me demande donc s'il n'y a pas un moyen de réduire ce nombre de fichiers. Ci-dessous un exemple d'un des fichiers php :

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
<?php 
$ident = $_REQUEST['id'];
try
{
	$bdd = new PDO('mysql:host=localhost;dbname=mairie_saubens;charset=utf8', 'root', '');
}
catch (Exception $e)
{
	die('Erreur : ' . $e->getMessage());
}
 
$reponse = $bdd->query('SELECT ent_nom
		FROM entreprises
		WHERE ent_id = '.$ident);
 
while($donnees = $reponse->fetch())
{
	echo $donnees['ent_nom'];
}
 
?>

Merci,

**francky74** · 15/03/2015, 00h06

Bonjour,

J'ai tenté de mettre les nombreux getElementById dans une boucle for et en les alimentant avec un tableau. Sans succès. Pourtant, j'ai vu des forums sur internet où l'utilisation d'un tableau dans un getElement ById fonctionne.

voici ce que j'ai fait :

Code :

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

1
2
3
4
5
6
7
8
9
10
var tabIdHidden = new array("hiddesignation", "hidsiret", "hidstatut", "hidsexerep", "hidnomrep", "hidprenomrep");
for (var i = 0; i < 6; i++) {
    xmlhttp2.onreadystatechange = function() {
        if (xmlhttp2.readyState == 4 && xmlhttp2.status == 200) {
            document.getElementById(tabIdHidden[i]).value = xmlhttp2.responseText;
        }
    }
    xmlhttp2.open("GET", "rempli" + tabIdHidden[i] + ".php?id=" + id, true);
    xmlhttp2.send();
}

**NoSmoking** · 15/03/2015, 11h02

La question qu'il faut que tu te poses est : Que vaut i au retour de la réponse ?

De plus je dirais que la multiplication des tes fonctions d'envoi n'est pas judicieuse, tu pourrais factoriser tout cela et notamment en passant en paramètre l'ID du champ que tu veux remplir, cela réglerait certains de tes problèmes.

**francky74** · 17/03/2015, 09h52

Merci pour les conseils

Est-il possible de passer en paramètre un tableau des id que je souhaite remplir ?
ce serait pas mal pour factoriser !?!

**Bovino** · 19/03/2015, 09h54

Code :

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

var tabIdHidden = new array("hiddesignation", "hidsiret", "hidstatut", "hidsexerep", "hidnomrep", "hidprenomrep");

Ouvre ta console de développement et tu pourras voir un très joli message :

ReferenceError: array is not defined

JavaScript étant sensible à la casse, array != Array !

[AJAX] Demande conseil sur sélection ElementById

AJAX

Vue hybride

Discussions similaires

Partager

Partager