recherche un calendrier un peu spécial

**gastoncs** · 11/09/2009, 00h25

Bonsoir,

depuis quelque jours je cherche un calendrier javascript afin de l'intégré à un formulaire de ma page php, je sais il y en a des centaines, mais moi je voudrais que l'utilisateur du calendrier ne puisse pas sélectionner une date supérieur de 7jours à la date actuelle.
et ca je n'ai pas trouvé, et comme le js c'est pas mon dada, je fai appel à vos connaissance. si quelqu'un connait un calendrier aussi personnilasble ?
MERCI d'avance

**SpaceFrog** · 11/09/2009, 09h07

Sujet déja traité ici avec grisage de dates . sur la base du calendirer fourni dans les contributions.

**gastoncs** · 11/09/2009, 14h41

tu aurais un lien par hasard, j'ai du mal à trouvé ???

**hotline** · 11/09/2009, 15h25

Perso, j'utilise ce script :
http://blog.dmsuperman.com/files/CakePicker/1.2/1.2.zip

**gastoncs** · 11/09/2009, 21h51

et est ce que tu peu me dire ou est ce qu'il faut que j'aille pour grisé et empêché la sélection des jours pour plus de 7jours de la date actuel ??
je ne sais pas trop quelle paramètre touché !
Merci

**hotline** · 12/09/2009, 08h10

Le calendrier est initialisé par une fonction init et la variable en question est start_date.

Dans ton fichier js (et pas dans datetime.js):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
function init()
{
   var today = new Date();
   var j        = today.getDate() - 7;
   var m       = today.getMonth() + 1;
   var cal      =  new dateTimePicker();
   cal.start_date = a + "-" + m + "-" + j;
   cal.init();
}

Et dans ton fichier html avant la fin du head

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<script type='text/javascript'>
window.onload = init;
</script>

**gastoncs** · 12/09/2009, 13h05

j'ai fait ce que tu a dis mais ca ne fonctionne pas, car je peu toujours sélectionné les 7 jours suivant la date !

et ne faut t'il pas utilisé la fonction unlinked_dates ? ou alors en faite, le script que tu ma envoyé permet de faire démarré le calendrier à -7 jours et + 1 mois ???

par contre dans quelle fichier dois je mettre ca :
(je pourrais trés bien le mettre dans datetime.js étant donné que il y a la variable start_date ? ou je dois crée un fichier .js juste pou ca !)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
function init()
{
   var today = new Date();
   var j        = today.getDate() - 7;
   var m       = today.getMonth() + 1;
   var cal      =  new dateTimePicker();
   cal.start_date = a + "-" + m + "-" + j;
   cal.init();
}

voici ma page html :

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
30
31
32
<html>
<head>
<link type="text/css" rel="stylesheet" href="1.2/datetime.css" />
		<script type="text/javascript" src="1.2/datetime.compressed.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
 
<script type="text/javascript">
		function bodyLoad(){
			var cal = new dateTimePicker();
			cal.date_format = "%m/%d/%Y";
			cal.time_format = "%H:%i";
			cal.datetime_format = "%d %t";
			cal.linked_days = [1, 2, 3, 4, 5];
			cal.linked_dates = ["2008-04-05", "2008-04-06"];
			cal.unlinked_dates = ["2008-04-03"];
		}
		</script>
 
<script type='text/javascript'>
window.onload = init;
</script>
 
 
</head>
 
<body onload="new dateTimePicker().init();">
 
<input type="text" name="myDate" rel="date" />
 
</body>
</html>

Merci beaucoup pour ton aide

**hotline** · 12/09/2009, 14h13

Désolé, c'est moi qui ais mal compris ta demande. Le code que je t'ai proposé grise toutes les dates antérieures à la date du jour -7.
Le +1 est là parce que la méthode date.getMonth renvoie 0 pour janvier et 11 pour décembre.
Si tu veux bloquer la saisie d'une date supérieure à J+7, il faut utiliser end_date au lieu de start_date.
Linked et unlinked sont utilisés pour créer des liens sur les dates du calendrier

**gastoncs** · 12/09/2009, 14h25

ok, donc j'ai changé mais la j'ai pas de calendrier qui s'affiche

regarde ma page html, est ce que tu vois une erreur ??? j'ai pourtant bien suivi ce que tu ma dis, et ce qu'il y aussi de le fichier README :

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
<html>
<head>
<link type="text/css" rel="stylesheet" href="1.2/datetime.css" />
	<script type="text/javascript" src="1.2/datetime.compressed.js"></script>
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 
<script type="text/javascript">
function init()
{
   var today = new Date();
   var j        = today.getDate() - 7;
   var m       = today.getMonth() + 1;
   var cal      =  new dateTimePicker();
   cal.end_date = a + "-" + m + "-" + j;
   cal.init();
}
 
 window.onload = cal.init;
 
		</script>
 
</head>
 
<body>
	<input type="text" name="myDate" rel="date" />
</body>
</html>

**gastoncs** · 12/09/2009, 14h38

Ah ben finalement c'est bon j'ai trouvé j'avait juste oublié le cal.init
UN GRAND GRAND GRAND merçi pour ton aide, qui ma permis d'avancé sur mon projet. merci

**hotline** · 12/09/2009, 17h03

Tant mieux si ça fonctionne !

Juste une petite précision, si tu utilises end_date, il faut bien sur faire +7 pour la variable j
et j'ai oublié la variable a :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part