Fonction javascript qui appelle une autre fonction javascript
Bonjour,
Je suis en train de développer une application de gestion des horaires hebdomadaire, et j'ai besoin de vos lumières
En fonction des horaires saisies, un calcul du nombre d'heures réalisées par le salarié doit être fait par l'application.
Et c'est là où je rencontre des difficultés :oops:
extrait de planning.jsp
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
46
47
48
49
50
51
52
53
|
<!-- Lundi -->
<td>
<input type="radio" id="demiab1_<s:property value="%{personneDto.idPersonne}"/>" name="work1_<s:property value="%{personneDto.idPersonne}"/>" value="0" onchange="afficheDiv('1_<s:property value="%{personneDto.idPersonne}"/>', 'demiab1_<s:property value="%{personneDto.idPersonne}"/>', 'pres1_<s:property value="%{personneDto.idPersonne}"/>')" /> 1/2 Abs
<input type="radio" id="ab1_<s:property value="%{personneDto.idPersonne}"/>" name="work1_<s:property value="%{personneDto.idPersonne}"/>" value="0" onchange="afficheDiv('1_<s:property value="%{personneDto.idPersonne}"/>', 'ab1_<s:property value="%{personneDto.idPersonne}"/>', 'pres1_<s:property value="%{personneDto.idPersonne}"/>')" />Abs
<input type="radio" id="pres1_<s:property value="%{personneDto.idPersonne}"/>" name="work1_<s:property value="%{personneDto.idPersonne}"/>" value="1" onchange="afficheDiv('1_<s:property value="%{personneDto.idPersonne}"/>', 'ab1_<s:property value="%{personneDto.idPersonne}"/>', 'pres1_<s:property value="%{personneDto.idPersonne}"/>')" checked/> Pres<br>
<div id="horaire1_<s:property value="%{personneDto.idPersonne}"/>" style="display: block;">
<table border="1">
<tr>
<td>
De <s:textfield name="horaire1dm_%{personneDto.idPersonne}" id="horaire1dm_%{personneDto.idPersonne}" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount(${personneDto.idPersonne})"/>A<s:textfield name="horaire1fm_%{personneDto.idPersonne}" id="horaire1fm_%{personneDto.idPersonne}" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount(${personneDto.idPersonne})"/>
</td>
</tr>
<tr>
<td>
De <s:textfield name="horaire1da_%{personneDto.idPersonne}" id="horaire1da_%{personneDto.idPersonne}" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount(${personneDto.idPersonne})"/>A<s:textfield name="horaire1fa_%{personneDto.idPersonne}" id="horaire1fa_%{personneDto.idPersonne}" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount(${personneDto.idPersonne})"/>
</td>
</tr>
</table>
</div>
<div id="abs1_<s:property value="%{personneDto.idPersonne}"/>" style="display: none;">
<table border="1">
<tr>
<td>
<s:select headerKey="-1" headerValue="Abs ?" id="absenceSelected1_%{personneDto.idPersonne}" name="absenceSelected1_%{personneDto.idPersonne}" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
</td>
</tr>
</table>
</div>
<div id="demiabs1_<s:property value="%{personneDto.idPersonne}"/>" style="display: none;">
<table border="1">
<tr>
<td>
<div id="horaire1DemiAbsMatin_<s:property value="%{personneDto.idPersonne}"/>"></div>
</td>
</tr>
<tr>
<td>
<s:select headerKey="-1" headerValue="Abs ?" id="demiabsenceSelected1_%{personneDto.idPersonne}" name="demiabsenceSelected1_%{personneDto.idPersonne}" list="listAbsenceDto" listKey="idAbsence" listValue="abrAbsence"></s:select>
</td>
</tr>
<tr>
<td>
<div id="horaire1DemiAbsApres_<s:property value="%{personneDto.idPersonne}"/>"></div>
</td>
</tr>
</table>
</div>
</td> |
Si l'utilisateur ne clique pas sur le bouton radio id="demiab1_" ou sur "id="ab1_", par défaut c'est la fonction doCount() qui est appelée
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
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
|
function doCount(idPersonne){
//alert("do count");
var res = 0;
for (i=1; i<8; i++){
var debutAM = 'horaire'+i+'dm_'+idPersonne;
var finAM = 'horaire'+i+'fm_'+idPersonne;
var debutPM = 'horaire'+i+'da_'+idPersonne;
var finPM = 'horaire'+i+'fa_'+idPersonne;
var debutDemiAbs = 'horaire'+i+'debDemiAbs_'+idPersonne;
var finDemiAbs = 'horaire'+i+'finDemiAbs_'+idPersonne;
var debutAM_value = document.getElementById(debutAM).value;
//alert("debutDemiAbs : "+debutDemiAbs);
//alert("finDemiAbs : "+finDemiAbs);
var finAM_value = document.getElementById(finAM).value;
var debutPM_value = document.getElementById(debutPM).value;
var finPM_value = document.getElementById(finPM).value;
var debutDemiAbs_value = "00:00";
alert("document.getElementById(debutDemiAbs).value ====> "+document.getElementById(debutDemiAbs).value);
if(document.getElementById(debutDemiAbs).value){
debutDemiAbs_value = document.getElementById(debutDemiAbs).value;
alert("DEMI début : "+debutDemiAbs_value);
}
//alert("Existnate : "+document.getElementById(debutDemiAbs_value));
var finDemiAbs_value = "00:00";
alert("document.getElementById(finDemiAbs).value ====> "+document.getElementById(finDemiAbs).value);
if(document.getElementById(finDemiAbs).value){
finDemiAbs_value = document.getElementById(finDemiAbs).value;
alert("DEMI Fin : "+finDemiAbs_value);
}
if(debutAM_value == ''){
debutAM_value = '00:00';
}
var debutAM_temps = debutAM_value.split(':');
var debutAM_heure = debutAM_temps[0];
var debutAM_min = debutAM_temps[1];
var debutAM_min_res = (parseInt(debutAM_heure*60))+parseInt(debutAM_min);
if(finAM_value == ''){
finAM_value = '00:00';
}
var finAM_temps = finAM_value.split(':');
var finAM_heure = finAM_temps[0];
var finAM_min = finAM_temps[1];
var finAM_min_res = (parseInt(finAM_heure*60))+parseInt(finAM_min);
//alert('finAM_min_res : '+finAM_min_res);
//calcul du temps effectué le matin en min
var totalAM_min = finAM_min_res - debutAM_min_res;
if(debutPM_value == ''){
debutPM_value = '00:00';
}
var debutPM_temps = debutPM_value.split(':');
var debutPM_heure = debutPM_temps[0];
var debutPM_min = debutPM_temps[1];
var debutPM_min_res = (parseInt(debutPM_heure*60))+parseInt(debutPM_min);
if(finPM_value == ''){
finPM_value = '00:00';
}
var finPM_temps = finPM_value.split(':');
var finPM_heure = finPM_temps[0];
var finPM_min = finPM_temps[1];
var finPM_min_res = (parseInt(finPM_heure*60))+parseInt(finPM_min);
//calcul du temps effectué l'apres midi en min
var totalPM_min = finPM_min_res - debutPM_min_res;
if(debutDemiAbs_value == ''){
debutDemiAbs_value = '00:00';
}
var debutDemiAbs_temps = debutDemiAbs_value.split(':');
var debutDemiAbs_heure = debutDemiAbs_temps[0];
var debutDemiAbs_min = debutDemiAbs_temps[1];
var debutDemiAbs_min_res = (parseInt(debutDemiAbs_heure*60))+parseInt(debutDemiAbs_min);
if(finDemiAbs_value == ''){
finDemiAbs_value = '00:00';
}
var finDemiAbs_temps = finDemiAbs_value.split(':');
var finDemiAbs_heure = finDemiAbs_temps[0];
var finDemiAbs_min = finDemiAbs_temps[1];
var finDemiAbs_min_res = (parseInt(finDemiAbs_heure*60))+parseInt(finDemiAbs_min);
//calcul du temps effectué durant la demi absence en min
var totalDemiAbs_min = finDemiAbs_min_res - debutDemiAbs_min_res;
//calcul total de l'heure effectué
var total_Global_min = parseInt(totalAM_min) + parseInt(totalPM_min) + parseInt(totalDemiAbs_min);
/*alert('totalAM_min : '+totalAM_min);
alert('totalPM_min : '+totalPM_min);
alert('totalDemiAbs_min : '+totalDemiAbs_min);
alert('total_Global_min : '+total_Global_min);*/
res += total_Global_min;
/*var total_Global_heure = Math.floor(total_Global_min/60)+":"+(total_Global_min%60);
alert('totalAM_min : '+total_Global_heure);*/
}
var heure_res = Math.floor(res/60);
if (heure_res == 0 || heure_res < 10) heure_res = "0"+heure_res;
var min_res = (res%60);
if (min_res == 0 || min_res < 10) min_res = "0"+min_res;
var total_Global_heure_sem = heure_res+":"+min_res;
//alert('total_Global_heure_sem : '+total_Global_heure_sem);
var champCache = 'nbHeureFaite_'+idPersonne;
document.getElementById(champCache).value = total_Global_heure_sem;
var div_res = 'div_nbHeureFaite_'+idPersonne;
document.getElementById(div_res).innerHTML=total_Global_heure_sem;
} |
Comme vous l'avez constaté, il y a la présence de bouton radio absence et demiabsence.
-> Si le salarié est en congé, l'utilisateur clique sur absence,
-> Si le salarié ne travaille que le matin ou l'après midi, l'utilisateur clique sur demiabsnce.
Si l'utilisateur clique sur le bouton radio absence ou demiabsence, d'autre fonctions sont appelée
Tout d'abord afficheDiv()
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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
function afficheDiv(position, nomAbs, nomPres)
{
//DECLARATION DES DIV
var nameDivHoraire = 'horaire'+position;
var nameDivAbsence = 'abs'+position;
var nameDivDemiAbsence = 'demiabs'+position;
//RECUPERATION DES INDEX ET ID PERSONNE
var chaine = position;
var tableau=chaine.split("_");
var index = tableau[0];
var idPersonne = tableau[1];
//DECLARATION DES NOMS DE VARIABLES (champs texte)
var debutAM = 'horaire'+index+'dm_'+idPersonne;
var finAM = 'horaire'+index+'fm_'+idPersonne;
var debutPM = 'horaire'+index+'da_'+idPersonne;
var finPM = 'horaire'+index+'fa_'+idPersonne;
//DECLARATION DES NOMS DE VARIABLES (select)
var absenceSelectedId = "absenceSelected"+index+"_"+idPersonne;
var demiAbsSelectedId = "demiabsenceSelected"+index+"_"+idPersonne;
var idAbs = document.getElementById(absenceSelectedId).options[document.getElementById(absenceSelectedId).selectedIndex].id;
var idDemiAbs = document.getElementById(demiAbsSelectedId).options[document.getElementById(demiAbsSelectedId).selectedIndex].id;
var text = nomAbs.substring(0, 4);
if (text == 'demi'){
openPopinMatinOuApres(idPersonne, index);
document.getElementById(nameDivAbsence).style.display = 'none';
var nameDivAbsence = 'demiabs'+position;
document.getElementById(absenceSelectedId).options[0].selected = true;
}else{
document.getElementById(nameDivDemiAbsence).style.display = 'none';
//ICI METTRE LES VARIABLES A VIDE
document.getElementById(demiAbsSelectedId).options[0].selected = true;
}
var nomAbs = document.getElementById(nomAbs);
if (nomAbs.checked) {
document.getElementById(nameDivAbsence).style.display = 'block';
alert("ici");
document.getElementById(nameDivHoraire).style.display = 'none';
document.getElementById(debutAM).value="00:00";
document.getElementById(finAM).value="00:00";
document.getElementById(debutPM).value="00:00";
document.getElementById(finPM).value="00:00";
}
var nomPres = document.getElementById(nomPres);
if (nomPres.checked) {
document.getElementById(nameDivAbsence).style.display = 'none';
document.getElementById(nameDivHoraire).style.display = 'block';
document.getElementById(nameDivDemiAbsence).style.display = 'none';
}
} |
Si c'est le bouton demiabsence qui est coché on fait appel à la méthode
Code:
1
2
3
4
5
6
7
8
9
|
function openPopinMatinOuApres(idPersonne, index)
{
document.forms["popinDemiAbsPreview"].elements["idPersonneDemiAbs"].value=idPersonne;
document.forms["popinDemiAbsPreview"].elements["indexDemiAbs"].value=index;
document.getElementById('divDemiAbsCreate').style.display='block';
} |
Cette dernière permet d'ouvrir une popin qui permet à l'utilisateur de préciser si la personne travaille le matin ou l'après midi.
popin
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
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
|
<div class="display" id="divDemiAbsCreate">
<div class="displayOpct">
<table id="tabCreate" align="center" width="600px" cellspacing="0" cellpadding="0" border="0" class="cadb">
<tbody>
<tr>
<td>
<table width="100%">
<tr>
<td width="20" height="20"><img vspace="5" hspace="5" src="./resources/img/cbb.gif">
</td>
<td style="font-size:12px;color: #4891C0;font-weight: bold" id="titre">
Gestion des demi-absences
</td>
<td style="font-size:10px;color: #4891C0;font-weight: bold" align="right">
<A href="#" onclick="closePreview();">Fermer</A>
</td>
</tr>
</table>
</td>
</tr>
<!-- Message d'information -->
<tr>
<td align="center">
<s:form name="popinDemiAbsPreview">
<s:hidden name="idPersonneDemiAbs" name="idPersonneDemiAbs" value="" />
<s:hidden name="indexDemiAbs" name="indexDemiAbs" value="" />
<table cellpadding=5 style="width:600;align:center;" class="cadre">
<tr>
<td style="text-align: center;">
Présent le :
</td>
</tr>
<tr>
<td style="text-align: center;">
<input type = 'radio' name='matinOuApres' value='matin'/>matin
</td>
</tr>
<tr>
<td style="text-align: center;">
<input type = 'radio' name='matinOuApres' value='apres'/>après midi
</td>
</tr>
<tr>
<td align="center">
<input type="button" value="Valider" onclick="returnDemiAbsValue(this.form.matinOuApres);">
<br/><br/>
</td>
</tr>
</table>
</s:form>
<br/><br/>
</td>
</tr>
</tbody>
</table>
</div>
</div> |
Avec cette popin, on fait appel à la fonction returnDemiAbsValue()
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
46
47
48
49
|
function returnDemiAbsValue(radio){
var idPersonne = document.forms["popinDemiAbsPreview"].elements["idPersonneDemiAbs"].value;
var index = document.forms["popinDemiAbsPreview"].elements["indexDemiAbs"].value;
var divDemiAbsMatinName = "horaire"+index+"DemiAbsMatin_"+idPersonne;
var divDemiAbsApresName = "horaire"+index+"DemiAbsApres_"+idPersonne;
var valChamp = "";
for (var i=0; i<radio.length;i++) {
if (radio[i].checked) {
valChamp = radio[i].value;
}
}
var idAbsenceSelected = "absenceSelected"+index;
var nameAbsenceSelected = "demiabsenceSelected"+index+"_"+idPersonne;
var horairedebDemiAbs = "horaire"+index+"debDemiAbs_"+idPersonne;
var horairefinDemiAbs = "horaire"+index+"finDemiAbs_"+idPersonne;
var html = '';
html = html+ '<td>De <s:textfield name="'+horairedebDemiAbs+'" id="'+horairedebDemiAbs+'" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount('+idPersonne+')"/>A <s:textfield name="'+horairedebDemiAbs+'" id="'+horairedebDemiAbs+'" size="5" maxLength="5" value="00:00" onBlur="javascript:doCount('+idPersonne+')"/></td>';
//alert("valeur horairedebDemiAbs ")
if (valChamp == "apres"){
document.getElementById(divDemiAbsApresName).innerHTML=html;
document.getElementById(divDemiAbsMatinName).innerHTML="";
document.getElementById(divDemiAbsApresName).style.display='block';
document.getElementById(divDemiAbsMatinName).style.display='none';
var debutDemiAbs_value = document.getElementById(horairedebDemiAbs).value;
//alert("DEMI début : "+debutDemiAbs_value);
}else if (valChamp == "matin"){
document.getElementById(divDemiAbsApresName).innerHTML="";
document.getElementById(divDemiAbsMatinName).innerHTML=html;
document.getElementById(divDemiAbsMatinName).style.display='block';
document.getElementById(divDemiAbsApresName).style.display='none';
}
//alert("valeur horairedebDemiAbs "+document.getElementById(horairedebDemiAbs).value);
document.getElementById('divDemiAbsCreate').style.display='none';
var nameDivDemiAbsence = "demiabs"+index+"_"+idPersonne;
//document.getElementById(nameDivDemiAbsence).style.display = 'block';
} |
Le problème que je rencontre se situe niveau du doCount. En effet, les calcules ne sont pas fait u_u'.
Lorsque je vais dans la console d'erreur de firefox, j'ai ce message d'erreur :
Code:
1
2
3
4
5
|
Horodatage*: 09/10/2012 20:49:38
Erreur*: TypeError: document.getElementById(debutDemiAbs) is null
Fichier Source*: http://localhost:8080/GestionHoraire/planningManagement_loadPlanning.action
Ligne*: 427 |
et lorsque je clique sur le lien proposé par la console d'erreur, j'ai ce message d'erreur :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
|
<div class="stacktrace" style="padding-left: 0em">
<strong>java.lang.NumberFormatException: null</strong>
<div>
<pre>
java.lang.Integer.parseInt(Integer.java:417)
java.lang.Integer.parseInt(Integer.java:499)
com.maison.enfant.gestion.horaire.action.planning.PlanningAction.loadPlanning(PlanningAction.java:1254)
sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method)
sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39)
sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25)
java.lang.reflect.Method.invoke(Method.java:597) |
Merci beaucoup de votre aide, car là, je ne sais pas comment solutionner mon pb.
