soucis de bouclage avec for

Version imprimable

Bonjour a tous.

bon je poste depuis ce compte car j'ai perdu mon ancien compte ^^
Pouvez vous me dire si cela est possible en fonction javascript?

Code:

1
2
3
4
5
6
7
8
9
10
11
function enfant(obj)
	{
		for(i=1;i<=test;i++)
		{
			document.formulaire.age[i].style.display="block";
		}
 
		for(i>test;i<=10;i++)
		{
			document.formulaire.age[i].style.display="none";
		}

voila le code que j'ai dans la page php.

Code:

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
 
	<Tr>
    	<TH>Nombre d'enfants :</TH>
        <TD>
        <SELECT name="nbrenfants" type="NUMERIC" onChange ="javascript:enfant(this);">
			<OPTION VALUE="0" SELECTED>0</OPTION>
			<OPTION VALUE="1">1</OPTION>
			<OPTION VALUE="2">2</OPTION>
			<OPTION VALUE="3">3</OPTION>
			<OPTION VALUE="4">4</OPTION>
			<OPTION VALUE="5">5</OPTION>
			<OPTION VALUE="6">6</OPTION>
			<OPTION VALUE="7">7</OPTION>
		</SELECT>
        </TD>
    </Tr>  
 
    <Tr>
    	<TH>Age du Premier Enfant :</TH>
        <TD><input name="age1" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du deuxième Enfant :</TH>
        <TD><input name="age2" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du Troisième Enfant :</TH>
        <TD><input name="age3" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du Quatrième Enfant :</TH>
        <TD><input name="age4" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du Cinquième Enfant :</TH>
        <TD><input name="age5" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du Sixième Enfant :</TH>
        <TD><input name="age6" type="text"><br></TD>
    </Tr>
    <Tr>
    	<TH>Age du Septième Enfant :</TH>
        <TD><input name="age7" type="text"><br></TD>
    </Tr>

09/03/2010, 19h40
SpaceFrog

Code:

name="age"

ou

si tu souhaites conserver ton age1 age2

Code:

document.getElementsByTagName('age'+i)[0].style.display="none";

ou

Code:

document.forms['formulaire'].elements['age'+i][0].style.display="none";
09/03/2010, 21h26
Auteur
bonsoir,

Code:

for(i>test;i<=10;i++)

le 1er argument de la boucle for consiste à affecter une valeur à la variable incrémentée. Or ici tu as i>test.

Peut-être as-tu voulu écrire :
Code:

1 2 for(i=test;i<=10;i++)
:question:
12/03/2010, 14h30
schwinny34

salut auteur ;)

non non ;)
juste au dessus, je parametre la valeur de test donc ca c'est bon.

je vais essayer la methode de SpaceFrog et vous tiens au courant ;)

merci beaucoup
12/03/2010, 14h36
E.Bzz

Bonjour,

Citation:

Envoyé par schwinny34

juste au dessus, je parametre la valeur de test donc ca c'est bon.

non ce n'est pas bon :aie:
Comme le dit Auteur, le 1° argument doit être la valeur de départ.
Un test n'a pas sa place ici (il ne sert à rien).
Si tu souhaites conserver la valeur de i en entrée de boucle, ne mets rien ...

A+

j'avais fait une erreur de copié collé :p

voila ce qui marche ;)

Code:

1
2
3
4
5
6
7
8
9
 
		for(i=1;i<=7;i++)
		{
			document.forms['formulaire'].elements['age'+i].style.display="none";	
		}	
		for(i=1;i<=document.formulaire.nbrenfants.value;i++)
		{
			document.forms['formulaire'].elements['age'+i].style.display="block";	
		}

Bon par contre, ce qui ne marche pas, c'est avec un div :(

Code:

1
2
 
document.getElementsByTagName('age1').style.display="none";

Code:

1
2
 
document.forms['formulaire'].elements['age'+i].style.display="none";

en parametrant le i :(

voila le code html:

Code:

1
2
3
4
5
6
 <div title="age1">	
     <Tr>
    	<TH>Age du </TH>
        <TD><input name="lage1" type="text"><br></TD>
    </Tr>
    </div>

14/03/2010, 18h45
SpaceFrog

Code:

name="lage1"

et

Code:

elements['age'+i]

pas étonnant ...
mais tu cibles l'input ou le div ... ???

si c'est le div, mets lui un id
et passe par getElementById('age'+i)
14/03/2010, 20h58
Auteur

Code:

document.getElementsByTagName('age1').style.display="none";

tu confonds les tag (div, span, p, a, input, etc.) avec l'attribut id d'un élément

ben en fait, j'ai une solution qui marche mais je voudrais passer par des div id pour etre tranquille.

j'ai ca en javascript

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
	function enfant(obj)
	{
		var ValeurTotale = 4;
		var temp = ValeurTotale - document.formulaire.nbrenfants.value;
		for(i=1;i<=ValeurTotale;i++)
		{
			document.getElementById('age'+i).style.display="none";
		}		
		for(i=1;i<=document.formulaire.nbrenfants.value;i++)
		{
			document.getElementById('age'+i).style.display="block";
		}
	}

puis en HTML ca

Code:

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
 
 
 <div id="age1">	
     <Tr>
    	<TH>Age du </TH>
        <TD><input name="lage1" type="text"><br></TD>
    </Tr>
    </div>
 
    <div id="age2">	
     <Tr>
    	<TH>Age du </TH>
        <TD><input name="lage2" type="text"><br></TD>
    </Tr>
    </div>
 
    <div id="age3">	
     <Tr>
    	<TH>Age du </TH>
        <TD><input name="lage3" type="text"><br></TD>
    </Tr>
    </div>
 
    <div id="age4">	
     <Tr>
    	<TH>Age du </TH>
        <TD><input name="lage4" type="text"><br></TD>
    </Tr>
    </div>

mais je reste bloquer car ca ne marche pas :(
quelqu'un peux me dire ou je fais une erreur svp?

16/03/2010, 13h23
SpaceFrog

SI on les mets cote à cote tu verras sans doute mieux ton erreur ...

Code:

document.getElementById('age'+i).style.display="block";

Code:

<TD><input name="lage2" type="text"><br></TD>

non toujours pas ??

id != name
je ne vois pas d'id dans tes balises input ...

Si c'était pour masquer les div et non l'input lui-même, c'était presque bon. :mrgreen:
Sauf que la structure de ta table n'est pas correcte : un <div> ne peut pas englober un <tr></tr> ...
Essaye peut être comme ça
Code:

1 2 3 4 <tr id="age2"> <TH>Age du </TH> <TD><input name="lage2" type="text"><br></TD> </tr>
En gardant la fonction comme elle est (enfin presque, mais les erreurs ne sont pas liées à ton problème)
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 function enfant() { var ValeurTotale = 4; // var temp = ValeurTotale - parseInt(document.formulaire.nbrenfants.value, 10); for(i=1;i<ValeurTotale;i++) { document.getElementById('age'+i).style.display="none"; } for(i=ValeurTotale;i<=document.formulaire.nbrenfants.value;i++) { document.getElementById('age'+i).style.display="block"; } }
Ton paramètre "obj" ne sert à rien.
temp non plus puisque tu ne l'utilises pas. Mais si tu souhaites l'utiliser, je l'ai corrigé ...

A+

Citation:

Envoyé par SpaceFrog

SI on les mets cote à cote tu verras sans doute mieux ton erreur ...

Code:

document.getElementById('age'+i).style.display="block";

Code:

<TD><input name="lage2" type="text"><br></TD>

non toujours pas ??

id != name
je ne vois pas d'id dans tes balises input ...

les div on un id :

Code:

<div id="age1">

:aie:

Une première erreur vient du code HTML : on n'encadre pas des balises utilisées pour les tableaux (tr, td, th, etc.) avec des balises div !

La seconde erreur doit venir de cette ligne :

Code:

document.formulaire.nbrenfants.value

Il y a un autre moyen plus efficace (et plus sûr) pour accéder à la valeur sélectionnée d'une liste :
Code:

1 2 3 4 5 6 //pour connaitre l'index de l'option choisie var index = document.getElementById("idListe").selectedIndex; // valeur de l'option choisie var valeur = document.getElementById("idListe").options[index].value;

16/03/2010, 14h25
SpaceFrog

:oops:
en effet deuxième fois que je me fais avoir ...
je l'ai même signalé plus haut ... :roll:

Citation:
Envoyé par Auteur
Il y a un autre moyen plus efficace (et plus sûr) pour accéder à la valeur sélectionnée d'une liste :
Code:

1 2 3 4 5 6 //pour connaitre l'index de l'option choisie var index = document.getElementById("idListe").selectedIndex; // valeur de l'option choisie var valeur = document.getElementById("idListe").options[index].value;
Et même (tant qu'il ne s'agit pas de select mutiple)
Code:

1 2 // valeur de l'option choisie var valeur = document.getElementById("idListe").value;
;)

A+

16/04/2010, 11h50
schwinny34

Merci a tous ;)
soucis resolue ;)