Afficher 2 date dans form (javascript) [Résolu/Fermé]

Signaler
Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
-
Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
-
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:
<p><label for="Date"> Date souhaitée : </label>
		<em>(utiliser les calendriers ci-contre)</em>&nbsp;&nbsp; Du : &nbsp;<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>&nbsp;
		<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>
		&nbsp;&nbsp;&nbsp;&nbsp; au : &nbsp;<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>&nbsp;
		<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

Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
405
Ah ! 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.
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;
Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
405
Salut et merci o,
Bien vu (je ne peux pas tester depuis mon bureau mais ça doit certainement être ça ! (j'avais simplement changé le
var cal1 = new calendar[2](document.forms['Coordonnees'].elements['DateFin']); 
(entre crochets) sans changer le var cal1 !
Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
405
Bonjour 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.
Messages postés
3133
Date d'inscription
mercredi 30 janvier 2002
Statut
Contributeur
Dernière intervention
20 octobre 2020
405
OK !!!!!!!!!!!!!!!! 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>&nbsp;&nbsp; Du :&nbsp;<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>&nbsp;
        <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>
		&nbsp;&nbsp;&nbsp;&nbsp;au :&nbsp;<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>&nbsp;
		<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.