Afficher 2 date dans form (javascript)
Résolu
Bonjour,
J'ai un souci dans un formulaire qui contient 2 calendriers (date de début et date de fin) ici (c'est la page de départ, bouton demande d'infos complémentaires) :
http://soeix.free.fr/Clients/Reservation.php
En cliquant sur le premier, la date s'inscrit dans le champ interdisant du coup l'ajout d'une seconde date en cliquant sur le second calendrier la page se trouve ici : http://soeix.free.fr/Clients/Reservation.php
Le code correspondant dans le formulaire est celui:
Je ne maitrise pas beaucoup le javascript mais je crois savoir qu'il faut ajouter un second élément (var cal1 = new calendar2).
En faisant ainsi je ne peux pas saisir une seconde date.
Quelqu'un voit-il une erreur dans ce code ?
Peut-être aurez-vous besoin d'autre chose alors n'hésitez pas à demander.
Merci beaucoup d'avance.
Le bonheur est la seule chose que l'on peut donner sans l'avoir.
J'ai un souci dans un formulaire qui contient 2 calendriers (date de début et date de fin) ici (c'est la page de départ, bouton demande d'infos complémentaires) :
http://soeix.free.fr/Clients/Reservation.php
En cliquant sur le premier, la date s'inscrit dans le champ interdisant du coup l'ajout d'une seconde date en cliquant sur le second calendrier la page se trouve ici : http://soeix.free.fr/Clients/Reservation.php
Le code correspondant dans le formulaire est celui:
<p><label for="Date"> Date souhaitée : </label>
<em>(utiliser les calendriers ci-contre)</em> Du : <a href="javascript:cal1.popup();"><img src="/Clients/img_calendar/cal.gif" width="16" height="16" border="0" alt="Cliquez ici pour choisir la date de début" title="Cliquez ici pour choisir la date de début." /></a>
<input type="text" name="DateDebut" id="DateDebut" tabindex="160" size="14" maxlength="25" />
<script language="JavaScript" type="text/javascript">
// créer un objet de calendrier juste après la fermeture d'un "tag de formulaire".
// Spécifier l'élément du formulaire comme le seul paramètre (document.forms['nom_du_formulaire'].elements['nom_d'entrée']);
// Note : vous pouvez avoir autant d'objets de calendrier dont vous avez besoin pour votre application
// elements.date ou ['date']" est le name du champ du formulaire juste au dessus
var cal1 = new calendar1(document.forms['Coordonnees'].elements['DateDebut']);
cal1.year_scroll = true;
cal1.time_comp = false;
</script>
au : <a href="javascript:cal1.popup();"><img src="/Clients/img_calendar/cal.gif" width="16" height="16" border="0" alt="Cliquez ici pour choisir la date de fin" title="Cliquez ici pour choisir la date de fin." /></a>
<input type="text" name="DateFin" id="DateFin" tabindex="170" size="14" maxlength="25" />
<script language="JavaScript" type="text/javascript">
var cal1 = new calendar2(document.forms['Coordonnees'].elements['DateFin']);
cal1.year_scroll = true;
cal1.time_comp = false;
</script></p>
Je ne maitrise pas beaucoup le javascript mais je crois savoir qu'il faut ajouter un second élément (var cal1 = new calendar2).
En faisant ainsi je ne peux pas saisir une seconde date.
Quelqu'un voit-il une erreur dans ce code ?
Peut-être aurez-vous besoin d'autre chose alors n'hésitez pas à demander.
Merci beaucoup d'avance.
Le bonheur est la seule chose que l'on peut donner sans l'avoir.
5 réponses
-
ContributeurOK !!!!!!!!!!!!!!!! J'ai trouvé ! Voici la solution pour ceux qui auraient à utiliser comme moi, deux calendriers:
<p><label for="Date"> Date souhaitée : </label> <em>(utiliser les calendriers ci-contre)</em> Du : <a href="javascript:cal1.popup();"><img src="/Clients/img_calendar/cal.gif" width="16" height="16" border="0" alt="Cliquez ici pour choisir la date de début" title="Cliquez ici pour choisir la date de début." /></a> <input type="text" name="datedebut" id="datedebut" tabindex="210" size="14" maxlength="25" /> <script language="JavaScript" type="text/javascript"> // créer un objet de calendrier juste après la fermeture d'un "tag de formulaire". // Spécifier l'élément du formulaire comme le seul paramètre (document.forms['nom_du_formulaire'].elements['nom_d'entrée']); // Note : vous pouvez avoir autant d'objets de calendrier dont vous avez besoin pour votre application // elements.date ou ['date']" est le name du champ du formulaire juste au dessus var cal1 = new calendar1(document.forms['Coordonnees'].elements['datedebut']); cal1.year_scroll = true; cal1.time_comp = false; </script> au : <a href="javascript:cal2.popup();"><img src="/Clients/img_calendar/cal.gif" width="16" height="16" border="0" alt="Cliquez ici pour choisir la date de fin" title="Cliquez ici pour choisir la date de fin." /></a> <input type="text" name="datefin" id="datefin" tabindex="220" size="14" maxlength="25" /> <script language="JavaScript" type="text/javascript"> var cal2 = new calendar1(document.forms['Coordonnees'].elements['datefin']); cal2.year_scroll = true; cal2.time_comp = false; </script></p>J'ai trop galéré pour le garder pour moi tout seul d'autant plus que je ne maitrise pas beaucoup javascript.
Bonne continuation !
Le bonheur est la seule chose que l'on peut donner sans l'avoir. -
ContributeurBonjour 0,
J'ai effectué les modifs en remplaçant les n° des var cal mais sans succès. J'ai donc remplacé aussi le new calendar par 2: même résultat. Le second popup s'ouvre mais on peut pas ajouter de date (http://soeix.free.fr/Clients/Reservation.php). Du coup j'ai modifié le script dont voici un extrait (j'ai ajouté un second popup):// Popup n°1 pour le premier calendrier. function cal_popup1 (str_datetime) { if (str_datetime) { this.dt_current = this.prs_tsmp(str_datetime); } else { this.dt_current = this.prs_tsmp(this.target.value); this.dt_selected = this.dt_current; } if (!this.dt_current) return; var obj_calwindow = window.open( 'calendar.html?datetime=' + this.dt_current.valueOf()+ '&id=' + this.id, 'Calendar', 'width=240,height=220'+ // taille du calendrier ',status=no,resizable=no,top=240,left=300,dependent=yes,alwaysRaised=yes' // n'est pas redimensionnable ); obj_calwindow.opener = window; obj_calwindow.focus(); } // =================================================== // Popup n°2 pour le second calendrier. function cal_popup2 (str_datetime) { if (str_datetime) { this.dt_current = this.prs_tsmp(str_datetime); } else { this.dt_current = this.prs_tsmp(this.target.value); this.dt_selected = this.dt_current; } if (!this.dt_current) return; var obj_calwindow = window.open( 'calendar.html?datetime=' + this.dt_current.valueOf()+ '&id=' + this.id, 'Calendar', 'width=240,height=220'+ // taille du calendrier ',status=no,resizable=no,top=240,left=400,dependent=yes,alwaysRaised=yes' // n'est pas redimensionnable ); obj_calwindow.opener = window; obj_calwindow.focus(); }
Le fichier est beaucoup plus long et sans doute y-a-t-il d'autres paramètres à ajouter. Mais je ne maitrise pas le javascript. J'ai déposé le fichier en entier ici: http://soeix.free.fr/calendar.js
Merci d'avance pour ton aide et surtout pour une explication (je veux comprendre ce que je fait).
Le bonheur est la seule chose que l'on peut donner sans l'avoir. -
ContributeurSalut et merci o,
Bien vu (je ne peux pas tester depuis mon bureau mais ça doit certainement être ça ! (j'avais simplement changé levar cal1 = new calendar[2](document.forms['Coordonnees'].elements['DateFin']);
(entre crochets) sans changer le var cal1 ! -
Pour le 2ème il faudrait plutot mettre qqch du genre :
var cal2 = new calendar1(document.forms['Coordonnees'].elements['DateFin']);
cal2.year_scroll = true;
cal2.time_comp = false; -
ContributeurAh ! si vous faites un test (la table sera vidée à la fin des tests) on a une erreur que je ne comprends pas. Pourriez-vous me l'expliquer SVP. (Je ne parle pas du tout l'anglais). Normal chui un p'tit basque ! hi hi hi.
Merci encore.
