FULLCALENDAR e REFRESH

[-AA-]

Ciao a tutti

http://arshaw.com/fullcalendar/

sto per implementare Fullcalendar in una aplicazione, e sto iniziando il tutto
Attualmente utilizzo JSON per popolare il calendario, come da guida (scaricando lo zip ci sono tutti gli esempi)

Ora però mi piacerebbe che modificando 1 qualsiasi record del mio DB, modificando o cancellando..il calendario si aggiornasse subito senza bisogno di fare un refresh di pagina.

Qualcuno ha già avuto esperienza in merito?

[-AA-]

up

[cavicchiandrea]

Originariamente inviato da -AA-
Ciao a tutti

http://arshaw.com/fullcalendar/

sto per implementare Fullcalendar in una aplicazione, e sto iniziando il tutto
Attualmente utilizzo JSON per popolare il calendario, come da guida (scaricando lo zip ci sono tutti gli esempi)

Ora però mi piacerebbe che modificando 1 qualsiasi record del mio DB, modificando o cancellando..il calendario si aggiornasse subito senza bisogno di fare un refresh di pagina.

Qualcuno ha già avuto esperienza in merito?

Ma se non vuoi ricaricare la pagina, potresti eseguire chiamate ajax ciclicamente (ogni tot di tempo), oppure schedulare il web server ma non è detto che sia possibile dipende dal hosting

[-AA-]

Ciao Andrea
e GRAZIE per la risposta!!!

In realtà con il web server posso fare quel che voglio perchè quel che sto facendo è una applicazione in locale per cui il web server verrà configurato con le esigenze del caso.

temporizzare chiamate AJAX, come da te suggerito mi potrebbe andar bene attualmente il locale per un test di sviluppo.

io faccio chiamate JSON attualmente, di seguito il codice

<script type='text/javascript'>
	$(document).ready(function() {
		var date = new Date();
		var d = date.getDate();
		var m = date.getMonth();
		var y = date.getFullYear();
		
		$('#calendar').fullCalendar({
			lazyFetching: false,
		
			header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay',
			},
			defaultView: 'agendaWeek',
					eventClick: function(event) {
						if (event.url) {
							$.fancybox({
								'transitionIn': 'none',
								'transitionOut': 'none',
								'width': '85%',
								'height': '85%',
								'type': 'iframe',
								'href': event.url,
								'onClosed': function() {
									parent.location.reload(true);
									
								}
								
							});
							return false;
							}
					},
			
			selectable: true,
			selectHelper: true,
			
			select: function(start, end, allDay) {
				var title = prompt('Inserire evento:');
				if (title) {
					calendar.fullCalendar('renderEvent',
						{
							title: title,
							start: start,
							end: end,
							allDay: allDay
						},
						true // make the event "stick"
					);
				}
				calendar.fullCalendar('unselect');
			},
			
			editable: true,

//QUESTA LA CHIAMATA
    eventSources: [

        {
            url: 'calendario-json.php', // use the `url` property
            color: 'green',    // an option!
            textColor: 'black'  // an option!
        }
    			  ],
//QUESTA LA CHIAMATA

			eventDrop: function(event, delta) {
			/*
				alert(event.title + ' è stato spostato di ' + delta + ' giorni ' +
					'(il database è stato regolarmente)');
			*/
			},
			
			loading: function(bool) {
				if (bool) $('#loading').show();
				else $('#loading').hide();
			}
			
			
		});

	});
</script>

ho provato a chiamare con AJAX ma senza successo, come posso implementare questa chiamata?

grazie ANCORA!!!

[-AA-]

sto riducendo al minimo lo script di caricamento per fare dei test, dalla documentazione ufficiale ho adopetaro questo

	$('#calendar').fullCalendar({
			events: function(start, end, callback) {
				$.ajax({
					url: 'test.php',
					dataType: 'xml',
					data: {
						// our hypothetical feed requires UNIX timestamps
						start: Math.round(start.getTime() / 1000),
						end: Math.round(end.getTime() / 1000)
					},
					success: function(doc) {
						var events = [];
						$(doc).find('event').each(function() {
							events.push({
								title: $(this).attr('title'),
								start: $(this).attr('start') // will be parsed
							});
						});
						callback(events);
					}
				});
			}
		});

callback(events); <--- dovrebbe far quel che chiedo
solo che.... così impostato non mi carica i dati da xml

l'xml è così compost

<events>
  <event title="event title" start="2012-11-15T10:30:00" allDay="false">
  <event title="event 2" start="2012-11-18T10:30:00" allDay="false">
</events>

[manublack]

Ciao...

anch'io di recente ho dovuto gestire FullCalendar e ti posso dire che il carimento degli eventi l'ho gestita tramite Json.... è molto figo e facile da usare....

Sicuramente se cerchi troverai degli esempi....

[-AA-]

Grazie manublack per il tuo intervento
sono sul pezzo anche ora...
attualmente carico tutti gli eventi necessari...
il mio cruccio è quello di capire come chiamare la lista di eventi per aggiornare il real time la situazione del calendario senza dover fare il refresh della pagina

come si esegue quella chiamata "continua" ? sono 3 giorni che ci provo
attualmente il mio codice è questo

$(document).ready(function() {
	
	
	var date = new Date();
	var d = date.getDate();
	var m = date.getMonth();
	var y = date.getFullYear();
		
	$('#calendar').fullCalendar({

		
   header: {
    left: 'prev,next today',
    center: 'title',
	right: 'month,agendaWeek,agendaDay',
   },
   
   firstHour: 6,
   firstDay: 1,
   allDaySlot : false,
   timeFormat: 'HH:mm',
   monthNames:['Gennaio','Febbraio','Marzo','Aprile','Maggio','Giugno','Luglio','Agosto','Settembre','Ottobre','Novembre','Dicembre'],
   monthNamesShort: ['Gen', 'Feb', 'Mar', 'Apr', 'Mag', 'Giu', 'Lug', 'Ago', 'Set', 'Ott', 'Nov', 'Dic'],
   dayNames: ['Domenica', 'Lunedì', 'Martedì', 'Mercoledì', 'Giovedì', 'Venerdì', 'Sabato'],
   dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mer', 'Gio', 'Ven', 'Sab'],
   buttonText: {
    prev:     ' &#9668 ',  
    next:     ' &#9658 ',  
    prevYear: ' << ',
    nextYear: ' << ',
    today:    'Oggi',
    month:    'Mese',
    week:     'Settimana',
    day:      'Giorno'
   },
   
   columnFormat: {
    month: 'ddd',    
    week: 'd/M ddd', 
    day: 'dddd d/M'  
   },

   
   events: {
    url: 'calendario-json.php',
    cache: true,
    color: 'purple', 
    textColor: 'white',
   },
 

	lazyFetching: false,
	defaultView: 'agendaWeek',
	selectable: true,
	selectHelper: true,
	editable: true,
	
					eventClick: function(event) {
						if (event.url) {
							$.fancybox({
								'transitionIn': 'none',
								'transitionOut': 'none',
								'width': '85%',
								'height': '85%',
								'type': 'iframe',
								'href': event.url,
								'onClosed': function() {
									parent.location.reload(true);
									
								}
								
							});
							return false;
							}
					},
			

			
			select: function(start, end, allDay) {
				var title = prompt('Inserire evento:');
				if (title) {
					calendar.fullCalendar('renderEvent',
						{
							title: title,
							start: start,
							end: end,
							allDay: allDay
						},
						true // make the event "stick"
					);
				}
				calendar.fullCalendar('unselect');
			},



			eventDrop: function(event, delta) {
			/*
				alert(event.title + ' è stato spostato di ' + delta + ' giorni ' +
					'(il database è stato regolarmente)');
			*/
			},

			
		});

});

la mia chiamata è

   events: {
    url: 'calendario-json.php',
    cache: true,
    color: 'purple', 
    textColor: 'white',
   },

io vorrei riuscire a chiamare continuamente la pagina calendario-json.php aggiornando così la vista del calendario, una chiamata ogni 2 secondi per esempio...

come cavolo si fa !?

[manublack]

Figurati.... ho visto che usi php.... Cè una funzione in php che ti permette di refreshare la pagina dopo un tot di tempo....

La funzione in questione è

header("refresh: totDitempo,url=indirizzo della pagina che vuoi refreshare);

spero di esserti stato d'aiuto....

[-AA-]

no manublack purtroppo questa non è la soluzione cercata
io devo fare il refresh del calendario senza fare il refresh di pagina, per cui sfruttare la chiamata JSON e chiamare il calendario ogni TOT secondi, ma non facendo il refresh della pagina

secondo me full calendar ha già dei metodi strutturati per fare questo , solo che devo capire come e dove usarli

[manublack]

Originariamente inviato da -AA-
no manublack purtroppo questa non è la soluzione cercata
io devo fare il refresh del calendario senza fare il refresh di pagina, per cui sfruttare la chiamata JSON e chiamare il calendario ogni TOT secondi, ma non facendo il refresh della pagina

secondo me full calendar ha già dei metodi strutturati per fare questo , solo che devo capire come e dove usarli

ok ok scusami non avevo capito... Comunque forse intendi questo comando .fullCalendar( 'refresh' ) che credo ti permetta di refreshare il calendario ma in ogni caso per sicurezza cerca tra la documentazione che trovi in questo link:

documentazione Full Calendar