Bonjour,
J'espère que quelqu'un pourra m'aider car je ne n'arrive pas à faire ce que je veux. J'ai essayé pleins de trucs mais en vain.
Voilà mon problème :
J'ai un formulaire avec :
- 2 inputs text où l'utilisateur saisi une 'date de début' et une 'date de fin'
- 2 inputs radio qui ne sont pas cochés par défaut
Voici le code html
Je surveille mes inputs 'date de début' et 'date de fin' et si je clique dans l'un d'eux pour saisir une date alors les 2 boutons 'j7' et 'j31' sont décochés.
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 <form action="{$smarty.server.REQUEST_URI}" method="post" class="clearfix"> <p class="clearfix"><span class="text-right">Période</span> <input class="dates" name="agd_date_debut" type="text" id="agd_date_debut" value=""/> <input class="dates" name="agd_date_fin" type="text" id="agd_date_fin" value="" /> <span class="zoneradio" style="margin-left: 6px"> <input type="radio" name="periode" value="j7" id="j7" {if $periode eq 'j7'}checked="checked"{/if}/> <label for="j7">J+7 jours</label> </span> <span class="zoneradio"> <input type="radio" name="periode" value="j31" id="j31"{if $periode eq 'j31'}checked="checked"{/if}/> <label for="j31">J+31 jours</label> </span> </p> <input type="submit" class="bouton-filtrer" value="Filtrer les resultats" name="Submit"/> </form>
Voici le code javascript :
Jusque là tout marche comme il faut.
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 <script language="JavaScript" type="text/javascript"> var initFormAgenda = function() { if(!$F('agd_date_debut')) $('agd_date_debut').value = 'Date de début'; if(!$F('agd_date_fin')) $('agd_date_fin').value = 'Date de fin'; $('agd_date_debut').observe('focus',function(e){ $('j7').checked = false;$('j31').checked = false; if(!$F('agd_date_debut').match(/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{2,4}$/)) $('agd_date_debut').value = ''; }); $('agd_date_debut').observe('blur',function(e){ if(!$F('agd_date_debut').match(/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{2,4}$/)) $('agd_date_debut').value = 'Date de début'; }); $('agd_date_fin').observe('focus',function(e){ $('j7').checked = false;$('j31').checked = false; if(!$F('agd_date_fin').match(/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{2,4}$/)) $('agd_date_fin').value = ''; }); $('agd_date_fin').observe('blur',function(e){ if(!$F('agd_date_fin').match(/^[0-9]{1,2}\/[0-9]{1,2}\/[0-9]{2,4}$/)) $('agd_date_fin').value = 'Date de fin'; }); $('periode').observe('click', function(e){ alert(Event.element(e).innerHTML); }); } document.observe('dom:loaded',initFormAgenda); </script>
Par contre, je voudrait observer mais boutons radio et si l'un d'eux est cliqué alors mes 2 inputs text 'date de debut' et 'date de fin' sont remis à zéro.
Quelqu'un a t'il une idée ou une piste ?
Merci d'avance
Isabelle
Partager