Discussion :

[KiranoO]

Bonjour,

J'ai un petit pb avec un onchange récalcitrant lors de la création dynamique d'un select : /

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
 
 var cellnomaff = row.insertCell(1);
		 var elaff = document.createElement('select');
		 elaff.name = p;
		 elaff.id = p;
		 elaff.onchange = function() { changeposi(p, this.value); };
		 <?php
                 for($r=0;$r<$tt;$r++)
                 {
                 ?>
		 elaff.options[<?php echo $r; ?>] = new Option('<?php echo $r+1; ?>', '<?php echo $r+1; ?>');
		 <?php
                 }
                 ?>
		 elaff.options[n].setAttribute('selected', 'selected');
 
		 cellnomaff.appendChild(elaff);

Donc le select se creer tres bien mais n'exécute pas le onchange et ne veux pas changer de valeur non plus d'ailleurs : /
Pb de syntaxe ? Ou autre pb ?

Merci de votre réponse

[andry.aime]

Salut,

elaff.name = p;
elaff.id = p;

De préférence

Code :

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

1
2
elaff.setAttribute('name',p);
elaff.setAttribute('id',p);

p a-t-elle un valeur?

[KiranoO]

Oui, j'ai fait un alert, P a bien la valeur que je souhaite, le onchange fonctionne correctement puisque il me renvoie les valeurs.
peut etre que le code entier serai bienvenue ?

[emmanuel.remy]

Après avoir corrigé les setAttribute, si ton problème persiste, il est dans changeposi(p, this.value);

Peux tu poster ton code HTML chargé ?

ERE

[KiranoO]

Pour infos c'est un tableau de position pour l'affichage dans un select de mes catégories.
Cette page sert donc a donner la possibilité de changer les position
voila le code entier :

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
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
 
<?php
include('configure.inc.php');
include('variable.php');
 
$sqlcount="SELECT COUNT(numcat) AS TT FROM ".$table_cat.";";
$reqcount=mysql_query($sqlcount);
$rescount=mysql_fetch_array($reqcount);
$tt=$rescount['TT'];
 
?>
<script language="javascript">
function changeposi(oldposition , newposition)
{
//****************************************Initialisation de valeur ********************************************************
 
	//alert (newposition);
	var tbl = document.getElementById('tableposition');
	var nbrow = tbl.rows.length;
 
	if(newposition>nbrow)
	{
		alert('position trop grande par rapport au tableau des positions, l\'element sea donc placé en derniere position'); 
		newposition=nbrow;
	}
 
//alert(newposition+'-----'+oldposition);
//**************************************Traitement des champs input type hidden ****************************************************
	if(newposition>oldposition)
	{
		alert('test');
		for(i=oldposition;i<newposition;i++)
		{
			namehidden='hidden'+i;
			b=Number(i)+1;
			namehiddensuivant='hidden'+b;
			//alert(i);
			if(i==oldposition)
			{
				valu=document.getElementById(namehidden).value;
				oldname='hidden'+newposition;
			}
			document.getElementById(namehidden).value=document.getElementById(namehiddensuivant).value;
		}
 
		document.getElementById(oldname).value=valu;
	}
	else
	{
		/*for(i=oldposition;i<newposition+1;i++)
		{
 
			document.getElementById(hidden).value--;
		}*/
	}
 
	for(n=1;n<=nbrow;n++)
	{
		name='hidden'+n;
	//	alert(document.getElementById(name).value);
	} 
//*****************Reconstruction du tableau de position grace aux champs input type hidden ***********************************
	 for(n=0;n<nbrow;n++)
	 {
	 	p=Number(n)+1;
 
 
	 	name='hidden'+p;
	 	value=document.getElementById(name).value;
 
		var c=n;
	 	tbl.deleteRow(n);
 
		var row = tbl.insertRow(n);
 
		 var cellTiT = row.insertCell(0);
		 var text = document.createElement('div');
		 text.innerHTML=document.getElementById(name).value;
		 cellTiT.appendChild(text); 
 
		 var cellnomaff = row.insertCell(1);
		 var elaff = document.createElement('select');
		 elaff.setAttribute('name',p);
		 elaff.setAttribute('id',p);
		 alert(c);
		 elaff.onchange = function() { changeposi(p, this.value); };
 
 
		 <?php
                 for($r=0;$r<$tt;$r++)
                 {
                 ?>
		 elaff.options[<?php echo $r; ?>] = new Option('<?php echo $r+1; ?>', '<?php echo $r+1; ?>');
		 <?php
                 }
                 ?>
		 elaff.options[n].setAttribute('selected', 'selected');
 
		 cellnomaff.appendChild(elaff); 
	 }
 
	/*
	if (oldposition>newposition)
	{
		for(i=oldposition;i<oldposition-1;i++)
		{
			//on change les valeur de input
		/*	var pos = 'position'+i;
			var valeur = Number (document.getElementById(pos).value)+1; 
			document.getElementById(i).value = Number(document.getElementById(i).value)-1; 
 
 
		}	
	}
	else
	if (oldposition<newposition)
	{
		for(i=oldposition;i<newposition;i++)
		{
			//on change les valeur de input
			//document.forms[0].elements[i].value--;
			var valpos = Number (i) + 1;
			var pos = 'position'+ valpos;
			var valeur = Number (document.getElementById(pos).value)-1;
			document.getElementById(pos).value=  valeur;			
 
 
		}	
	}	*/
 
 
 
 
 
 
}
</script>
<script language="javascript">
function valid()
{
	document.forms[0].submit();
}
</script>
<br /><br />
<div align="left" style="margin-left:15px;">
<a href="index.php?pages=mat.php&session=<?php echo $session; ?>"><img src="images/retour.png" border="0" /></a>
</div>
<?php
 
$sql="SELECT * FROM ".$table_cat." ORDER BY position;";
$req=mysql_query($sql);
 
?>
<br /><br />
<div align="center">
 
 
		Tableau des positions
 
	<br /><br />
<form name="position" action="index.php?pages=validposi.php&session=<?php echo $session; ?>"  method="post">	
<table border="1" id="tableposition">
<?php
 
 
while($boucle=mysql_fetch_array($req))
{
 
?>
	<tr>
		<td>
			<div>
			<?php echo $boucle['nomcat']; ?>
			</div>
		</td>
		<td>
		<center>
			<select name="<?php echo $boucle['position']; ?>" id="<?php echo $boucle['position']; ?>" onchange="changeposi('<?php echo $boucle['position']; ?>' , this.value);">
			<?php
                                for($p=1;$p<=$tt;$p++)
                                {
                        ?>
					<option value="<?php echo $p; ?>" <?php if($p==$boucle['position']) { echo 'selected="selected"'; } ?>><?php echo $p; ?></option>
			<?php
                        }
                        ?>
			</select>
	</center>
		</td>
	</tr>
<?php 
} ?>
</table>
<?php
$req2=mysql_query($sql);
while($boucle2=mysql_fetch_array($req2))
{
 
        echo '
        <input type="text" name="hidden'.$boucle2['position'].'" id="hidden'.$boucle2['position'].'" value="'.$boucle2['nomcat'].'">';
}
 
?>
<br /><br />
	<input type="button" value="valider" onclick="valid();" />
	<br /><br />
 
 
 
 
</div>

Le pb c que P prend toujours la valeur 7 : /

[emmanuel.remy]

Dans ton code, tu écris cela:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
	 for(n=0;n<nbrow;n++)
	 {
	 	p=Number(n)+1;
 
...		
		 var elaff = document.createElement('select');
...
		 elaff.onchange = function() { changeposi(p, this.value); };
...
        }

Or ta fonction sur le onchange n'est pas évaluée ici, mais plus tard lors de l'appel réel. Et ta fonction a stocké non pas la valeur de p mais la variable.
Moralité lors de l'appel p aura toujours la même valeur, et tu peux vérifier que cette valeur est en fait nbrow, soit 7 dans ton cas.

Tu dois donc modifier ton code pour éviter cela, en passant p sous la forme d'un paramètre d'appel de fonction.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
for(n=0;n<nbrow;n++)
{
  p=Number(n)+1;
...		
  var elaff = document.createElement('select');
...
  elaff.onchange = function(num) { 
                         return function() {
                                    changeposi(num, this.value); 
                           }
                    }(p);
...
}

Cela devrait rentrer dans l'ordre
ERE

[KiranoO]

Merci beaucoup pour l'explication et pour le code, j'ai compris et c'est juste
encore merci

[emmanuel.remy]

Merci beaucoup pour l'explication et pour le code, j'ai compris et c'est juste
encore merci

Pas acquis de conscience, j'avais testé avant !

ERE