[Calendrier] FullCalendar et boucle php

Version imprimable

Bonjour

j'ai installé FullCalendar, qui fonctionne tres bien, cependant j'aimerais le coupler avec une base de donnée..

pour ca je fais une boucle php, histoire de récuperer les infos qui m'interressent, le souci c'est que si je met la boucle avant le javascript, il m'affiche autant de calendrier que de resultats (ce qui est logique) mais je ne vois pas comment faire pour mettre le code php dans le script qui me permettrait de ressortir toutes les infos sur un seul calendrier..

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
 
<?php 
include ('../../connex.php');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.print.css' media='print' />
<script type='text/javascript' src='../jquery/jquery-1.5.2.min.js'></script>
<script type='text/javascript' src='../jquery/jquery-ui-1.8.11.custom.min.js'></script>
<script type='text/javascript' src='../fullcalendar/fullcalendar.min.js'></script>
 
  <?php 
$retour = mysql_query("SELECT * FROM test_calend WHERE id_patient = '01' ");
while ($donnees = mysql_fetch_array($retour)){
?>  
 
 
<script type='text/javascript'>
	$(document).ready(function() {
		var date = new Date();
		var d = date.getDate();
		var m = date.getMonth();
		var y = date.getFullYear();
		var calendar = $('#calendar').fullCalendar({
			header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
			selectable: true,
			selectHelper: true,
			select: function(start, end, allDay) {
				var title = prompt('Event Title:');
				if (title) {
					calendar.fullCalendar('renderEvent',
						{
							title: title,
							start: start,
							end: end,
							allDay: allDay
						},
						true // make the event "stick"
					);
				}
				calendar.fullCalendar('unselect');
			},
			editable: true,
    	events: [ 
				{
					title: '<?php echo $donnees["presciption"];?> ',
					start: new Date(y, <?php echo $donnees['dated_m'];?>, <?php echo $donnees['dated_j'];?>),
					end: new Date(y, <?php echo $donnees['datef_m'];?>, <?php echo $donnees['datef_j'];?>)
				},
				{
					title: 'Birthday Party',
					start: new Date(y, m, d+1, 19, 0),
					end: new Date(y, m, d+1, 22, 30),
					allDay: false
				}		    
			]  
		});		  
	});   
</script>  
<?php } ?> 
 
 
<style type='text/css'>
body {
		margin-top: 40px;
		text-align: center;
		font-size: 14px;
		font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
		}
#calendar {
		width: 900px;
		margin: 0 auto;
}
</style>
 
</head>
<body>
<div id='calendar'></div>
</body>
</html>

si quelqu'un savait comment faire pour crée la boucle dans le script ..

Merci

29/12/2011, 13h46
marbouchi
pour pouvoir afficher les information sur le calendrier à partir d'une base de données vous devez utiliser ceci :
Code:

1 2 3 events { url: 'le chemin du script php qui cherche les données'; }
dans ce script vous devez retournez les résultat sous forme de json avec à la fin

Code:

echo json_endode();

Hello ♪
Je ne suis pas certains de comprendre comment tu appel tes données au sein de ton calendrier, mais je vais partir du principe que :

Citation:

Envoyé par groskanel

Code:

1
2
3
4
5
6
7
 
[...]
  <?php 
$retour = mysql_query("SELECT * FROM test_calend WHERE id_patient = '01' ");
while ($donnees = mysql_fetch_array($retour)){
?> 
[...]

Reviens à un parcours de données de ta base, et génère donc les résultats dans :

Citation:

Envoyé par groskanel

Code:

1
2
3
4
5
6
7
8
9
 
[...]
    	events: [ 
				{
					title: '<?php echo $donnees["presciption"];?> ',
					start: new Date(y, <?php echo $donnees['dated_m'];?>, <?php echo $donnees['dated_j'];?>),
					end: new Date(y, <?php echo $donnees['datef_m'];?>, <?php echo $donnees['datef_j'];?>)
				},
[...]

Sache bien que, de la même façon dont tu à fermé ton parcours PHP .. :

Citation:

Envoyé par groskanel

Code:

1
2
3
4
5
 
[...]
</script>  
<?php } ?> 
[...]

Et pour ta conversion des dates en start et end compatibles,
Tu peux appeler du PHP à tous moment au sein de ton p'ti script !
Et donc avoir quelque chose comme :

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
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
 
[...]
<script type='text/javascript'>
	$(document).ready(function() {
		var date = new Date();
		var d = date.getDate();
		var m = date.getMonth();
		var y = date.getFullYear();
		var calendar = $('#calendar').fullCalendar({
			header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
			selectable: true,
			selectHelper: true,
			select: function(start, end, allDay) {
				var title = prompt('Event Title:');
				if (title) {
					calendar.fullCalendar('renderEvent',
						{
							title: title,
							start: start,
							end: end,
							allDay: allDay
						},
						true // make the event "stick"
					);
				}
				calendar.fullCalendar('unselect');
			},
			editable: true,
    	events: [ 
                               <?php 
                                   $retour = mysql_query("SELECT * FROM test_calend WHERE id_patient = '01' ");
                                   while ($donnees = mysql_fetch_array($retour)) //Parcours de la BD, tant que parcouru : on créer un event tel que :
                                  {
                                ?>  
				      {
					title: '<?php echo $donnees["presciption"];?> ',
					start: new Date(y, <?php echo $donnees['dated_m'];?>, <?php echo $donnees['dated_j'];?>),
					end: new Date(y, <?php echo $donnees['datef_m'];?>, <?php echo $donnees['datef_j'];?>)
				      },
                                <?php
                                 } //Fin du parcours de BD
                                 ?>
				{
					title: 'Birthday Party',
					start: new Date(y, m, d+1, 19, 0),
					end: new Date(y, m, d+1, 22, 30),
					allDay: false
				}		    
			]  
		});		  
	});   
</script>
[...]

Ainsi, là on créer un évènement dans le calendrier, pour tous tes éléments en base, de la table "test_calend" avec un "id_patient" à 1, puis un event "Birthday Party" à part, créé en dur.
J'espère avoir bien compris ton fonctionnement et avoir répondu à ton problème, FullCalendar est vraiment super à manier une fois qu'on arrive à lui poser ses propres données, et j'ai aussi un peu galéré à y poser les miennes :D !