2 pièce(s) jointe(s)
Modifier le contenu d'un formulaire lors d'un click sur un div
Bonjour à tous,
Je suis bien conscient qu'il existe plusieurs sujets sur la question mais aucun de ceux que j'ai pu trouver au cours de mes recherches ne répondait à mes questions avec les contraintes qui y sont liées.
Je suis donc actuellement en stage, étant étudiant en informatique et mon sujet de stage était "correction de bugs et complément d'applications au site existant"
Il se trouve que sur ce site, une des choses qui m'a été demandée est de faire changer l'heure de début et l'heure de fin de travail d'un employé sur le planning en fonction de l'endroit ou l'on clique sur le tableau du planning (image en PJ) qui est séparé selon les divs suivants :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<table id="planning">
<thead>
<tr>
<th class="first">Agent</th>
<th class="last" style="width:1040px">
<div class="info_horaire deuxheures" style="border:none">6h - 8h</div>
<div class="info_horaire deuxheures" >8h - 10h</div>
<div class="info_horaire deuxheures">10h - 12h</div>
<div class="info_horaire heuredemi">12h - 13h30</div>
<div class="info_horaire deuxheures">13h30 - 15h30</div>
<div class="info_horaire deuxheures">15h30 - 17h30</div>
<div class="info_horaire heuredemi">17h30 - 19h</div>
</th>
</tr>
</thead>
<tbody>
<?php
echo $this->tab;
?>
</tbody>
</table> |
De plus, lors d'un double click n'importe ou sur la ligne d'un agent(sauf sur une tache déjà existante évidemment), cela ouvre un formulaire ( aussi en pièce jointe) dont les champs d'horaires sont déjà préremplis grace à un script que voici :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
|
function initPause() {
$("#debutTache").val("08:00");
$("#finTache").val("17:15");
$("#pause").attr('checked' , 'checked');
$("[id$=Pause-label]").css('margin-left', '50px');
$("#debutPause").val("12:00");
$("#finPause").val("13:30");
$("[id^=debutPause] , [id^=finPause]").show();
} |
Ma principale difficulté étant que je souhaiterai que si je clique sur le nom de l'agent, la pause soit activée et l'agent commencerai à 8h pour finir à 17h15, que si je clique sur le div 6h-8h, l'agent commence à 6h et finit à 8h et la pause du midi est désactivée, que si je clique sur un div entre 8h et 12h la pause soit désactivée et qu'il travaille de 8h a 12h et ainsi de suite...
ps : un agent peut avoir plusieurs taches par jour.
j'ai déjà essayé de corriger ce problème en faisant comme suit, mais vous vous apercevrez très rapidement que je suis un novice dans tout domaine impliquant du javascript...
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
| function initPause() {
if($("#info_horaire deuxheures").value="1"){
//pour chaque div, j'attribuais une valeur comme ceci : <div class="info_horaire deuxheures" style="border:none" value="1">6h - 8h</div>
$("#debutTache").val("6:00");
$("#finTache").val("8:00");
$("#pause").attr('checked' , 'unchecked');
}else if($("#info_horaire deuxheures").value="2"){
$("#debutTache").val("8:00");
$("#finTache").val("12:00");
$("#pause").attr('checked' , 'unchecked');
}else if($("#info_horaire deuxheures").value="3"){
$("#debutTache").val("13:30");
$("#finTache").val("17:15");
$("#pause").attr('checked' , 'unchecked');
}else if($("#info_horaire heuredemi").value="4"){
$("#debutTache").val("17:15");
$("#finTache").val("19:00");
$("#pause").attr('checked' , 'unchecked');
}else{
$("#debutTache").val("08:00");
$("#finTache").val("17:15");
$("#pause").attr('checked' , 'checked');
}
$("[id$=Pause-label]").css('margin-left', '50px');
$("#debutPause").val("12:00");
$("#finPause").val("13:30");
$("#debutTache").onChange=togglePause();
$("#finTache").onChange=togglePause();
$("[id^=debutPause] , [id^=finPause]").show();
}
function togglePause(){
if($("#finTache").val("8:00")||$("#finTache").val("12:00")||$("#debutTache").val("13:30")||$("#debutTache").val("17:15")) {
$("#pause").attr('checked' , 'unchecked');
}else{
$("#pause").attr('checked' , 'checked');
}
}; |
merci de votre attention :)
