Changement de couleur des div

**leara500** · 26/03/2013, 20h34

Bonjour,
Je développe une application de gestion des horaires. Dès lors, comme des personne travaille le WE, je dois mettre en évidence les horaires des personnes qui travaille le WE.

Pour cela j'ai développé cette fonction JS :

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
 
function verifCouleur(){
	var idArray = [];
	var elements = document.getElementsByName('idPersonneSelected') ;
 
	var dateAujourdhuiVar = dojo.widget.byId("dateModif").getDate();
	xx(dojo.widget.byId("dateModif").getDate());
 
	var jourdhui=new Date();
	var jour=xx(jourdhui.getDate());
	var mois=xx(jourdhui.getMonth()+1);
	var an=xx(jourdhui.getFullYear());
 
	var dateAujourdhuiValue = jour+'-'+mois+'-'+an;
	//alert("dateAujourdhui : "+dateAujourdhuiValue);
 
		for (var i=0, n=elements.length; i<n; i++){
			alert("nb : "+elements.length);
		idArray.push(elements.value);
		var idPersonne = elements[i].value;
		var variableNbHeureAfaire = "nbHeureAfaire_"+idPersonne;
		var nbHeureAFaire = document.forms["createForm"].elements[variableNbHeureAfaire].value;
		//alert("nbHeureAFaire : "+nbHeureAFaire);
 
		var variableNbHeureFaite = 'nbHeureFaite_'+idPersonne;
		var nbHeureFaite = document.forms["createForm"].elements[variableNbHeureFaite].value;
		//alert("nbHeureFaite : "+nbHeureFaite);
 
		var div_res = 'div_nbHeureFaite_'+idPersonne;
 
		if(nbHeureFaite == null){
			document.getElementById(div_res).innerHTML== "00:00 heure";
		}
 
		if(nbHeureAFaire != nbHeureFaite){
			//alert("Valzue non égale");
			document.getElementById(div_res).style.color = "red";
		} else{
			document.getElementById(div_res).style.color = "black";
		}
 
 
		//Pour mettre en évidence les heure travailler le Week and
		var horaireSamedi = "divHoraireModif6_"+idPersonne;
		var horaireDimanche = "divHoraireModif7_"+idPersonne;
 
		if(document.getElementById(horaireSamedi) != null){
			document.getElementById(horaireSamedi).style.backgroundColor = "#EDAA44";
 
		}
		if(document.getElementById(horaireDimanche) != null){
			document.getElementById(horaireDimanche).style.backgroundColor = "#EDAA44";
 
		}
		//Pour mettre en couleur si les horaires ont été modifié
		 for(n=1; n<8; n++) {
 
				var divHoraire = "divHoraireModif"+n+"_"+idPersonne; // pour savoir l'horaire de travail de la personne
				var varModifJour = "ModifJour"+n+"_"+idPersonne; //Pour savoir si l'horaire a été modificie
				var dateJour = "jour"+n;
				var divDemiAbs = "divDemiAbsenceModif"+n+"_"+idPersonne;
				var divAbs = "divAbsenceModif"+n+"_"+idPersonne;
 
				var divJour = "divJour"+n+"_"+idPersonne;
				var dateJourValue = document.getElementById(dateJour).value;
 
				//alert("dateJourValue : "+dateJourValue);
 
				//Pour mettre en évidence la date d'aujourd'hui
				if(dateAujourdhuiValue == dateJourValue){
					//alert("ICICICICICCI divJour : "+divJour);
 
					document.getElementById(divJour).style.backgroundColor = "#6BD8CA";
					document.getElementById(divDemiAbs).style.color  = "green";
					document.getElementById(divHoraire).style.color  = "green";
					document.getElementById(divAbs).style.color  = "green";
 
				}
 
 
				//alert("valeur : "+document.getElementById(varModifJour).value);
				if(document.getElementById(varModifJour).value == 'oui'){
 
					document.getElementById(divDemiAbs).style.color = "red";
					document.getElementById(divHoraire).style.color = "red";
					document.getElementById(divAbs).style.color = "red";
				}
 
		}
 
 
	}
 
 
}

Donc mon

Code :

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

alert("nb : "+elements.length);

me renvoit bien le bon nombre de personne.

J'ai bien un changement de couleur grâce à ce code ...

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
//Pour mettre en évidence les heure travailler le Week and
		var horaireSamedi = "divHoraireModif6_"+idPersonne;
		var horaireDimanche = "divHoraireModif7_"+idPersonne;
 
		if(document.getElementById(horaireSamedi) != null){
			document.getElementById(horaireSamedi).style.backgroundColor = "#EDAA44";
 
		}
		if(document.getElementById(horaireDimanche) != null){
			document.getElementById(horaireDimanche).style.backgroundColor = "#EDAA44";
 
		}

Toutefois, seule les 8 premières personne de cette liste ont un changement de couleurs ..... Or je ne vois pas où est le pb .../

Pourriez vous m'aider ?

**SylvainPV** · 26/03/2013, 20h50

Bonjour,

On ne va pas pouvoir t'aider en l'état : aucune idée de à quoi ressemble le HTML, des bouts de JS incomplets, a priori il y aurait du dojo dans le tas...

Cerne le problème, et plutôt que des couleurs ou des alert utilise le debugger pour vérifier tes valeurs. Là tu nous demandes de chercher une aiguille dans une botte de foin avec un bandeau sur un oeil.

**leara500** · 26/03/2013, 20h59

Je vous remercie de m'avoir répondu aussi rapidement, et je vous prie de bien vouloir trouver ci-dessous un extrait de mon formulaire :

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
<!-- Lundi -->		
<td style="text-align: center;">
<div id ="divJour1_<s:property value="%{personneDto.idPersonne}"/>" style="display: block; text-align: center;">
<div id="horaire1_<s:property value="%{personneDto.idPersonne}"/>" style="display: block; text-align: center;">
 <table border="0" style=" background-color: transparent; ">
	<tr>
	<td style="display: block; text-align: left;">
		<!-- Gestion des horaires travailles -->
		 <s:set var="val1dm" value="%{defaultValue}"/> 
		 <s:set var="val1fm" value="%{defaultValue}"/>
				<s:if test="personneDto.idPersonne == jourDispAM.idPersonne">
					<!-- avant : ${val1dm} -->
					<s:if test="jourDispAM.horaire1dm != null ">
						<s:if test="jourDispAM.horaire1dm != defaultValue">
							<s:set var="val1dm" value="%{jourDispAM.horaire1dm}"/> 
						</s:if>
					</s:if>
					<!-- avant : ${val1fm} -->
 
					<s:if test="jourDispAM.horaire1fm != null ">
						<s:if test="jourDispAM.horaire1fm != defaultValue">
 
							<s:set var="val1fm" value="%{jourDispAM.horaire1fm}"/>
 
 
						</s:if>
					</s:if>
				</s:if>
 
		 <!-- jourDispAM.horaire1dm : ${jourDispAM.horaire1dm}<br>
		 jourDispPM.horaire1da : ${jourDispAM.horaire1da} <br>
		 defaultValue : ${defaultValue}-->
		<div id="divHoraireModif1_<s:property value="%{personneDto.idPersonne}"/>"> 
		<s:if test="jourDisp.idAbsenceSelected1 != defaultValueAb">
			<s:hidden id="horaire1dm_%{personneDto.idPersonne}" name="horaire1dm_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fm_%{personneDto.idPersonne}" name="horaire1fm_%{personneDto.idPersonne}" value="" />
			<s:hidden id="horaire1da_%{personneDto.idPersonne}" name="horaire1da_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fa_%{personneDto.idPersonne}" name="horaire1fa_%{personneDto.idPersonne}" value="" />
		</s:if>
		<s:if test="jourDisp.idDemiAbsenceSelected1 != defaultValueAb">
			<s:hidden id="horaire1dm_%{personneDto.idPersonne}" name="horaire1dm_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fm_%{personneDto.idPersonne}" name="horaire1fm_%{personneDto.idPersonne}" value="" />
			<s:hidden id="horaire1da_%{personneDto.idPersonne}" name="horaire1da_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fa_%{personneDto.idPersonne}" name="horaire1fa_%{personneDto.idPersonne}" value="" />
		</s:if>
		<s:if test="jourDisp.idAbsenceSelected1 == defaultValueAb">
		<s:if test="jourDisp.idDemiAbsenceSelected1 == defaultValueAb">
 
 
 
			 De <s:hidden id="horaire1dm_%{personneDto.idPersonne}" name="horaire1dm_%{personneDto.idPersonne}" value="%{val1dm}" />  ${val1dm} 
			 à <s:hidden id="horaire1fm_%{personneDto.idPersonne}" name="horaire1fm_%{personneDto.idPersonne}" value="%{val1fm}" />  ${val1fm}<br>
 
		<s:if test="jourDispAM.horaire1dm == defaultValue"> 
			<s:hidden id="horaire1dm_%{personneDto.idPersonne}" name="horaire1dm_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fm_%{personneDto.idPersonne}" name="horaire1fm_%{personneDto.idPersonne}" value="" /> 
		</s:if>	
 
			<s:set var="val1da" value="%{defaultValue}"/>
			<s:set var="val1fa" value="%{defaultValue}"/>
			<s:if test="personneDto.idPersonne == jourDispPM.idPersonne">
				<!-- avant : ${val1dm} -->
				<s:if test="jourDispPM.horaire1da != null">
					<s:if test="jourDispPM.horaire1da != defaultValue">
						<s:set var="val1da" value="%{jourDispPM.horaire1da}"/>
					</s:if>
				</s:if>
				<!-- avant : ${val1fm} -->
				<s:if test="jourDispPM.horaire1fa != null">
					<s:if test="jourDispPM.horaire1fa != defaultValue">
						<s:set var="val1fa" value="%{jourDispPM.horaire1fa}"/>
					</s:if>
				</s:if>
			</s:if>
 
 
		<s:if test="jourDispPM.horaire1da != defaultValue">
			 De <s:hidden id="horaire1da_%{personneDto.idPersonne}" name="horaire1da_%{personneDto.idPersonne}" value="%{val1da}" />  ${val1da}
			 à <s:hidden id="horaire1fa_%{personneDto.idPersonne}" name="horaire1fa_%{personneDto.idPersonne}" value="%{val1fa}" />  ${val1fa}
		</s:if>	
		<s:if test="jourDispPM.horaire1da == defaultValue">
			<s:hidden id="horaire1da_%{personneDto.idPersonne}" name="horaire1da_%{personneDto.idPersonne}" value="" /> 
			<s:hidden id="horaire1fa_%{personneDto.idPersonne}" name="horaire1fa_%{personneDto.idPersonne}" value="" /> 
		</s:if>	
 
		</s:if>
		</s:if>	
 
		</div>
 
		<!-- Gestion des horaires demi absences -->
		<s:set var="val1demidm" value="%{defaultValue}"/>
		<s:set var="val1demifm" value="%{defaultValue}"/>
			<s:if test="personneDto.idPersonne == jourDispDM.idPersonne">
				<!-- avant : ${val1dm} -->
				<s:if test="jourDispDM.typeDemiAbsence1 == 'DMA' "> 
					<s:set var="val1demidm" value="%{jourDispDM.horaire1debApresDemiAbs}"/>
 
				</s:if>
				<s:if test="jourDispDM.typeDemiAbsence1 == 'DMM' "> 
					<s:set var="val1demidm" value="%{jourDispDM.horaire1debMatinDemiAbs}"/>
 
				</s:if>
				<!-- avant : ${val1fm} -->
				<s:if test="val1demifm != defaultValue">
					<s:if test="jourDispDM.typeDemiAbsence1 == 'DMA' "> 
						<s:set var="val1demifm" value="%{jourDispDM.horaire1finApresDemiAbs}"/>
					</s:if>
					<s:if test="jourDispDM.typeDemiAbsence1 == 'DMM' "> 
						<s:set var="val1demifm" value="%{jourDispDM.horaire1finMatinDemiAbs}"/>
					</s:if>
				</s:if>
			</s:if>
 
		<div id="divDemiAbsenceModif1_<s:property value="%{personneDto.idPersonne}"/>"> 
			<s:if test="jourDispDM.typeDemiAbsence1 == 'DMA' "> 
				est là
				 de <s:hidden name="horaire1debApresDemiAbs_%{personneDto.idPersonne}" id="horaire1debApresDemiAbs_%{personneDto.idPersonne}" value="%{val1demidm}"/>  ${val1demidm}
				 à  <s:hidden name="horaire1finApresDemiAbs_%{personneDto.idPersonne}" id="horaire1finApresDemiAbs_%{personneDto.idPersonne}" value="%{val1demifm}"/> ${val1demifm} </br>
				<s:hidden id="demiabsenceSelected1_%{personneDto.idPersonne}" name="demiabsenceSelected1_%{personneDto.idPersonne}" value="%{jourDisp.idDemiAbsenceSelected1}"/> est en  : ${jourDisp.demiabsenceSelected1} <br>
			</s:if>
 
			<s:if test="jourDispDM.typeDemiAbsence1 == 'DMM' "> 
				<s:hidden id="demiabsenceSelected1_%{personneDto.idPersonne}" name="demiabsenceSelected1_%{personneDto.idPersonne}" value="%{jourDisp.idDemiAbsenceSelected1}"/> est en  : ${jourDisp.demiabsenceSelected1} <br>
				est là
				de <s:hidden name="horaire1debMatinDemiAbs_%{personneDto.idPersonne}" id="horaire1debMatinDemiAbs_%{personneDto.idPersonne}" value="%{val1demidm}"/>  ${val1demidm}
				 à  <s:hidden name="horaire1finMatinDemiAbs_%{personneDto.idPersonne}" id="horaire1finMatinDemiAbs_%{personneDto.idPersonne}" value="%{val1demifm}"/> ${val1demifm} </br>
			</s:if>
 
			<s:if test="jourDisp.idDemiAbsenceSelected1 == defaultValueDemiAb">
 
			</s:if>
				<s:hidden id="demiabsenceSelected1_%{personneDto.idPersonne}" name="demiabsenceSelected1_%{personneDto.idPersonne}" value=""/> 
				<s:hidden name="horaire1debDemiAbs_%{personneDto.idPersonne}" id="horaire1debDemiAbs_%{personneDto.idPersonne}" value=""/> 
				<s:hidden name="horaire1finDemiAbs_%{personneDto.idPersonne}" id="horaire1finDemiAbs_%{personneDto.idPersonne}" value=""/>
 
		</div>
 
		 <div id="divAbsenceModif1_<s:property value="%{personneDto.idPersonne}"/>"> 
			 <s:if test="jourDisp.idAbsenceSelected1 != defaultValueAb">
				<s:hidden id="absenceSelected1_%{personneDto.idPersonne}" name="absenceSelected1_%{personneDto.idPersonne}" value="%{jourDisp.idAbsenceSelected1}"/> Absence ${jourDisp.absenceSelected1} 
			</s:if>	
			<s:if test="jourDisp.idAbsenceSelected1 == defaultValueAb">
				<s:hidden id="absenceSelected1_%{personneDto.idPersonne}" name="absenceSelected1_%{personneDto.idPersonne}" value="" />  
			</s:if>	
		</div>
		<div id="dureeJour1_<s:property value="%{personneDto.idPersonne}"/>">
			 <input type='hidden' id="dureeJour1_<s:property value='%{personneDto.idPersonne}'/>" name="dureeJour1_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.dureeJour1}"  />  
		</div>
 
		<div id="divDureeJourAfaire1_<s:property value="%{personneDto.idPersonne}"/>">
			 <input type='hidden' id="dureeJourAfaire1_<s:property value='%{personneDto.idPersonne}'/>" name="dureeJourAfaire1_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.dureeJourAfaire1}"  />  
		</div>
 
		<div id="divModifJour1_<s:property value="%{personneDto.idPersonne}"/>">
			 <input type='hidden' id="ModifJour1_<s:property value='%{personneDto.idPersonne}'/>" name="ModifJour1_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.modifHoraireJour1}"  />  
		</div>
 
		<input type='hidden' id="jour1" name="jour1" value="${jourDisp.dateJourNum1}"  />  
 
	</td>
	</tr> 
</table>
<div id="preview"> 
	<a href="#" style="color: #1891C0;font-weight: bold" 
	onclick="openPreview('<s:property value="%{personneDto.idPersonne}"/>','<s:property value="personneDto.nom"/>','<s:property value="personneDto.prenom"/>','<s:property value="%{jourDisp.dateComplet1}"/>','${val1dm}','${val1fm}','${val1da}','${val1fa}','${jourDisp.demiabsenceSelected1}','${val1demidm}','${val1demifm}','${jourDisp.absenceSelected1}','1')">
	<img alt="Modifier les valeurs de ce jour" src="./resources/img/modif.gif"> </a>
</div>
</div>
</div>
 
</td>

Ce que je ne comprend pas, c'est pourquoi seul les 8 premiers occurence de ma liste ont droit à un changement de couleurs et non le reste alors qu'il me récupère :
- le bon nombre total de ma liste
- les bon identifiants de personnes présente de cette même liste.

**SylvainPV** · 26/03/2013, 21h20

Vous allez devoir faire le tri dans les informations données, là il y a près de 200 lignes de HTML (avec du code serveur malgré les règles de la section) et je ne trouve nulle part le "divHoraireModif6" correspondant à la case du samedi que vous souhaitez colorer. Donc tout ça ne me sert à rien pour résoudre votre problème...

Je ne peux que vous conseiller d'utiliser des classes au lieu de systématiquement utiliser des ID et de faire un effort pour centraliser votre code. Car avec autant de lignes pour juste la case du Lundi, je n'ose imaginer la taille de vos JSP

**leara500** · 26/03/2013, 21h34

Effectivement, étant donné que je n'ai mis que l'extrait de code correspondant à lundi, vous n'aviez pas le code du samedi u_u'.

En outre, c'est la première que j'utilise du javascript et je m'excuse si mes informations ne sont pas claire.

Par ailleurs, la liste que je récupère est une liste de personne avec les différents horaires réalisé par jour, sur une semaine donnée.

En l'occurence, pour chacune de mes div, les id sont construit de la manière suivante :
NomDeLaDiv+NuméroDuJour+_+idDeLaPersonne.
ex

Code :

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

 <div id ="divJour6_<s:property value="%{personneDto.idPersonne}"/>" >   ou <s:property value="%{personneDto.idPersonne}"/>" correspond à l'id de la 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
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
 
<!-- Samedi -->		
  <td style="text-align: center;">
   <div id ="divJour6_<s:property value="%{personneDto.idPersonne}"/>" style="display: block; text-align: center;">
 <div id="horaire6_<s:property value="%{personneDto.idPersonne}"/>" style="display: block; text-align: center;">
	 <table border="0" style=" background-color: transparent; ">
		<tr>
		<td style="display: block; text-align: left;">
			<!-- Gestion des horaires travailles -->
			 <s:set var="val6dm" value="%{defaultValue}"/> 
			 <s:set var="val6fm" value="%{defaultValue}"/>
					<s:if test="personneDto.idPersonne == jourDispAM.idPersonne">
						<!-- avant : ${val6dm} -->
						<s:if test="jourDispAM.horaire6dm != null ">
							<s:if test="jourDispAM.horaire6dm != defaultValue">
								<s:set var="val6dm" value="%{jourDispAM.horaire6dm}"/> 
							</s:if>
						</s:if>
						<!-- avant : ${val6fm} -->
 
						<s:if test="jourDispAM.horaire6fm != null ">
							<s:if test="jourDispAM.horaire6fm != defaultValue">
 
								<s:set var="val6fm" value="%{jourDispAM.horaire6fm}"/>
 
 
							</s:if>
						</s:if>
					</s:if>
 
			 <!-- jourDispAM.horaire6dm : ${jourDispAM.horaire6dm}<br>
			 jourDispPM.horaire6da : ${jourDispAM.horaire6da} <br>
			 defaultValue : ${defaultValue}-->
			<div id="divHoraireModif6_<s:property value="%{personneDto.idPersonne}"/>"> 
			<s:if test="jourDisp.idAbsenceSelected6 != defaultValueAb">
				<s:hidden id="horaire6dm_%{personneDto.idPersonne}" name="horaire6dm_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fm_%{personneDto.idPersonne}" name="horaire6fm_%{personneDto.idPersonne}" value="" />
				<s:hidden id="horaire6da_%{personneDto.idPersonne}" name="horaire6da_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fa_%{personneDto.idPersonne}" name="horaire6fa_%{personneDto.idPersonne}" value="" />
			</s:if>
			<s:if test="jourDisp.idDemiAbsenceSelected6 != defaultValueAb">
				<s:hidden id="horaire6dm_%{personneDto.idPersonne}" name="horaire6dm_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fm_%{personneDto.idPersonne}" name="horaire6fm_%{personneDto.idPersonne}" value="" />
				<s:hidden id="horaire6da_%{personneDto.idPersonne}" name="horaire6da_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fa_%{personneDto.idPersonne}" name="horaire6fa_%{personneDto.idPersonne}" value="" />
			</s:if>
			<s:if test="jourDisp.idAbsenceSelected6 == defaultValueAb">
			<s:if test="jourDisp.idDemiAbsenceSelected6 == defaultValueAb">
 
 
 
				 De <s:hidden id="horaire6dm_%{personneDto.idPersonne}" name="horaire6dm_%{personneDto.idPersonne}" value="%{val6dm}" />  ${val6dm} 
				 à <s:hidden id="horaire6fm_%{personneDto.idPersonne}" name="horaire6fm_%{personneDto.idPersonne}" value="%{val6fm}" />  ${val6fm}<br>
 
			<s:if test="jourDispAM.horaire6dm == defaultValue"> 
				<s:hidden id="horaire6dm_%{personneDto.idPersonne}" name="horaire6dm_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fm_%{personneDto.idPersonne}" name="horaire6fm_%{personneDto.idPersonne}" value="" /> 
			</s:if>	
 
				<s:set var="val6da" value="%{defaultValue}"/>
				<s:set var="val6fa" value="%{defaultValue}"/>
				<s:if test="personneDto.idPersonne == jourDispPM.idPersonne">
					<!-- avant : ${val6dm} -->
					<s:if test="jourDispPM.horaire6da != null">
						<s:if test="jourDispPM.horaire6da != defaultValue">
							<s:set var="val6da" value="%{jourDispPM.horaire6da}"/>
						</s:if>
					</s:if>
					<!-- avant : ${val6fm} -->
					<s:if test="jourDispPM.horaire6fa != null">
						<s:if test="jourDispPM.horaire6fa != defaultValue">
							<s:set var="val6fa" value="%{jourDispPM.horaire6fa}"/>
						</s:if>
					</s:if>
				</s:if>
 
 
			<s:if test="jourDispPM.horaire6da != defaultValue">
				 De <s:hidden id="horaire6da_%{personneDto.idPersonne}" name="horaire6da_%{personneDto.idPersonne}" value="%{val6da}" />  ${val6da}
				 à <s:hidden id="horaire6fa_%{personneDto.idPersonne}" name="horaire6fa_%{personneDto.idPersonne}" value="%{val6fa}" />  ${val6fa}
			</s:if>	
			<s:if test="jourDispPM.horaire6da == defaultValue">
				<s:hidden id="horaire6da_%{personneDto.idPersonne}" name="horaire6da_%{personneDto.idPersonne}" value="" /> 
				<s:hidden id="horaire6fa_%{personneDto.idPersonne}" name="horaire6fa_%{personneDto.idPersonne}" value="" /> 
			</s:if>	
 
			</s:if>
			</s:if>	
 
			</div>
 
			<!-- Gestion des horaires demi absences -->
			<s:set var="val6demidm" value="%{defaultValue}"/>
			<s:set var="val6demifm" value="%{defaultValue}"/>
				<s:if test="personneDto.idPersonne == jourDispDM.idPersonne">
					<!-- avant : ${val6dm} -->
					<s:if test="jourDispDM.typeDemiAbsence6 == 'DMA' "> 
						<s:set var="val6demidm" value="%{jourDispDM.horaire6debApresDemiAbs}"/>
 
					</s:if>
					<s:if test="jourDispDM.typeDemiAbsence6 == 'DMM' "> 
						<s:set var="val6demidm" value="%{jourDispDM.horaire6debMatinDemiAbs}"/>
 
					</s:if>
					<!-- avant : ${val6fm} -->
					<s:if test="val6demifm != defaultValue">
						<s:if test="jourDispDM.typeDemiAbsence6 == 'DMA' "> 
							<s:set var="val6demifm" value="%{jourDispDM.horaire6finApresDemiAbs}"/>
						</s:if>
						<s:if test="jourDispDM.typeDemiAbsence6 == 'DMM' "> 
							<s:set var="val6demifm" value="%{jourDispDM.horaire6finMatinDemiAbs}"/>
						</s:if>
					</s:if>
				</s:if>
 
			<div id="divDemiAbsenceModif6_<s:property value="%{personneDto.idPersonne}"/>"> 
				<s:if test="jourDispDM.typeDemiAbsence6 == 'DMA' "> 
					est là
					 de <s:hidden name="horaire6debApresDemiAbs_%{personneDto.idPersonne}" id="horaire6debApresDemiAbs_%{personneDto.idPersonne}" value="%{val6demidm}"/>  ${val6demidm}
					 à  <s:hidden name="horaire6finApresDemiAbs_%{personneDto.idPersonne}" id="horaire6finApresDemiAbs_%{personneDto.idPersonne}" value="%{val6demifm}"/> ${val6demifm} </br>
					<s:hidden id="demiabsenceSelected6_%{personneDto.idPersonne}" name="demiabsenceSelected6_%{personneDto.idPersonne}" value="%{jourDisp.idDemiAbsenceSelected6}"/> est en  : ${jourDisp.demiabsenceSelected6} <br>
				</s:if>
 
				<s:if test="jourDispDM.typeDemiAbsence6 == 'DMM' "> 
					<s:hidden id="demiabsenceSelected6_%{personneDto.idPersonne}" name="demiabsenceSelected6_%{personneDto.idPersonne}" value="%{jourDisp.idDemiAbsenceSelected6}"/> est en  : ${jourDisp.demiabsenceSelected6} <br>
					est là
					de <s:hidden name="horaire6debMatinDemiAbs_%{personneDto.idPersonne}" id="horaire6debMatinDemiAbs_%{personneDto.idPersonne}" value="%{val6demidm}"/>  ${val6demidm}
					 à  <s:hidden name="horaire6finMatinDemiAbs_%{personneDto.idPersonne}" id="horaire6finMatinDemiAbs_%{personneDto.idPersonne}" value="%{val6demifm}"/> ${val6demifm} </br>
				</s:if>
 
				<s:if test="jourDisp.idDemiAbsenceSelected6 == defaultValueDemiAb">
 
				</s:if>
					<s:hidden id="demiabsenceSelected6_%{personneDto.idPersonne}" name="demiabsenceSelected6_%{personneDto.idPersonne}" value=""/> 
					<s:hidden name="horaire6debDemiAbs_%{personneDto.idPersonne}" id="horaire6debDemiAbs_%{personneDto.idPersonne}" value=""/> 
					<s:hidden name="horaire6finDemiAbs_%{personneDto.idPersonne}" id="horaire6finDemiAbs_%{personneDto.idPersonne}" value=""/>
 
			</div>
 
			 <div id="divAbsenceModif6_<s:property value="%{personneDto.idPersonne}"/>"> 
				 <s:if test="jourDisp.idAbsenceSelected6 != defaultValueAb">
					<s:hidden id="absenceSelected6_%{personneDto.idPersonne}" name="absenceSelected6_%{personneDto.idPersonne}" value="%{jourDisp.idAbsenceSelected6}"/> Absence ${jourDisp.absenceSelected6} 
				</s:if>	
				<s:if test="jourDisp.idAbsenceSelected6 == defaultValueAb">
					<s:hidden id="absenceSelected6_%{personneDto.idPersonne}" name="absenceSelected6_%{personneDto.idPersonne}" value="" />  
				</s:if>	
			</div>
			<div id="dureeJour6_<s:property value="%{personneDto.idPersonne}"/>">
				 <input type='hidden' id="dureeJour6_<s:property value='%{personneDto.idPersonne}'/>" name="dureeJour6_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.dureeJour6}"  />  
			</div>
			<div id="divDureeJourAfaire6_<s:property value="%{personneDto.idPersonne}"/>">
				 <input type='hidden' id="dureeJourAfaire6_<s:property value='%{personneDto.idPersonne}'/>" name="dureeJourAfaire6_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.dureeJourAfaire6}"  />  
			</div>
			 <div id="divModifJour6_<s:property value="%{personneDto.idPersonne}"/>">
				 <input type='hidden' id="ModifJour6_<s:property value='%{personneDto.idPersonne}'/>" name="ModifJour6_<s:property value='%{personneDto.idPersonne}'/>" value="${jourDisp.modifHoraireJour6}"  />  
			</div>
			 <input type='hidden' id="jour6" name="jour6" value="${jourDisp.dateJourNum6}"  />  
		</td>
		</tr>
	</table>
	<div id="preview"> 
		<a href="#" style="color: #6896C0;font-weight: bold" 
		onclick="openPreview('<s:property value="%{personneDto.idPersonne}"/>','<s:property value="personneDto.nom"/>','<s:property value="personneDto.prenom"/>','<s:property value="%{jourDisp.dateComplet6}"/>','${val6dm}','${val6fm}','${val6da}','${val6fa}','${jourDisp.demiabsenceSelected6}','${val6demidm}','${val6demifm}','${jourDisp.absenceSelected6}','6')">
		<img alt="Modifier les valeurs de ce jour" src="./resources/img/modif.gif"> </a>
	</div>
</div>
</div>	
</td>

Comme je vous l'ai dit plus haut, ce que je ne comprend pas, c'est pourquoi seul les 8 premiers occurence de ma liste ont droit à un changement de couleurs et non le reste alors qu'il me récupère :
- le bon nombre total de ma liste
- les bon identifiants de personnes présente de cette même liste.

Ainsi, ce bout de code (comme l'ensemble des différentes fonction JS que j'utilise)

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
//Pour mettre en évidence les heure travailler le Week and
	var horaireSamedi = "divHoraireModif6_"+idPersonne;
	var horaireDimanche = "divHoraireModif7_"+idPersonne;
 
	if(document.getElementById(horaireSamedi) != null){
		document.getElementById(horaireSamedi).style.backgroundColor = "#EDAA44";
 
	}
	if(document.getElementById(horaireDimanche) != null){
		document.getElementById(horaireDimanche).style.backgroundColor = "#EDAA44";
 
	}

ne fonctionne que pour les éléments en début de ma liste de personne.

**NoSmoking** · 26/03/2013, 22h27

Bonsoir,

Toutefois, seule les 8 premières personne de cette liste ont un changement de couleurs

une boucle dans une boucle avec une même variable n, que penses tu qu'il se passe

Code :

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

1
2
3
4
  for (var i = 0, n = elements.length; i < n; i++) {
/...
    //Pour mettre en couleur si les horaires ont été modifié
    for (n = 1; n < 8; n++) {

**SylvainPV** · 26/03/2013, 23h23

Bien vu NoSmoking

J'aurais dû chercher '8' dans le code

**leara500** · 27/03/2013, 09h12

Merci beaucoup pour votre aide. ^^

Changement de couleur des div

JavaScript

Discussions similaires

Partager

Partager