Interagire con full calendar
- Questo topic ha 1 risposta, 2 partecipanti ed è stato aggiornato l'ultima volta 10 anni, 2 mesi fa da
jqueryitalia.
- AutorePost
- 24 Luglio 2013 alle 17:25 #4863
veronica
PartecipanteBuongiorno a tutti,
da qualche giorno sono in realizzazione di una pagina web che contiene un calendario (full calendar) per la visualizzazione (e anche per la modifica e/o cancellazione) degli eventi che vado a creare nella stessa pagina.
Vi trasmetto il codice che contiene lo script di definizione del calendar e il codice dove, leggendo dal mio database, vado a far visualizzare gli eventi nel calenadrio.
1° php<script> function CreaCalendario(){ var date = new Date(); var d = date.getDate(); var m = date.getMonth(); var y = date.getFullYear(); $('.external-class').each(function() { // create an Event Object (http://arshaw.com/fullcalendar/docs/event_data/Event_Object/) // it doesn't need to have a start or end var eventObject = { title: $.trim($(this).text()) // use the element's text as the event title }; // store the Event Object in the DOM element so we can get to it later $(this).data('eventObject', eventObject); // make the event draggable using jQuery UI $(this).draggable({ zIndex: 999, revert: true, // will cause the event to go back to its revertDuration: 0, // original position after the drag start: function(){ $('#calendar').fullCalendar('changeView', 'agendaWeek'); } }); }); $('#calendar').fullCalendar({ day: 'dddd, MMM d, yyyy', theme: true, header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, titleFormat: { month: 'MMMM yyyy', week: "MMMM d[ yyyy]{ '—'[ MMM] d, yyyy}", day: 'dddd, d MMMM yyyy' }, columnFormat: { month: 'ddd', week: 'ddd d', day: 'dddd M/d' }, editable: true, selectable: true, droppable: true, // this allows things to be dropped onto the calendar !!! minTime: 9, firstHour: 9, maxTime: 21, lastHour: 21, events: "php/eventi.php" }); $('#calendar').fullCalendar('changeView', 'agendaWeek'); } </script>
lettura del mio data base e caricamento del calendario con : php/eventi.php che é presente nello script sopra riportato:
<?php $array = array(); $conn = db2_connect('*****','*****','*****'); if ($conn) { // Elenco disponibilità $query01 = "SELECT DTDISP, ORINDI, ORFIDI FROM LIBL.FILE001L1 WHERE CD0000 = '$cd00001' AND CD0000 = '$cd00002'"; $result = db2_exec($conn, $query01); $availability_list = Array(); $i=0; while($rows = db2_fetch_both($result)) { $availability_list[$i]['DTDISP'] = $rows['DTDISP']; $availability_list[$i]['ORINDI'] = $rows['ORINDI']; $availability_list[$i]['ORFIDI'] = $rows['ORFIDI']; $year01 = substr($availability_list[$i]['DTDISP'], 0,4); $month01 = substr($availability_list[$i]['DTDISP'], 4,2); $day01 = substr($availability_list[$i]['DTDISP'], 6,2); $timestart = $availability_list[$i]['ORINDI']; $timeend = $availability_list[$i]['ORFIDI']; // Verifica dell'orario inizio if($timestart < 1000) { $ora01 = "0".substr($timestart, 0, 1); $min01 = substr($timestart, 1, 2); } else { $ora01 = substr($timestart, 0, 2); $min01 = substr($timestart, 2, 2); } $ora02 = substr($timeend, 0, 2); $min02 = substr($timeend, 2, 2); // Verifica dell'orario fine if($timeend < 1000) { $ora02 = "0".substr($timeend, 0, 1); $min02 = substr($timeend, 1, 2); } else { $ora02 = substr($timeend, 0, 2); $min02 = substr($timeend, 2, 2); } $array[$i] = array( 'id' => $i, 'title' => "Disp. $cd00001", 'start' => "$year01-$month01-$day01 $ora01:$min01", 'end' => "$year01-$month01-$day01 $ora02:$min02", 'allDay' => false); $i++; } } echo json_encode($array); // Chiudo la connessione db2_close($conn); //} ?>
Per adesso visualizzo gli eventi nei determinati giorni del mio calendario. Vorrei poter interagire con i singoli giorni (quelli che contengono un evento) del mio calendario (con il click del mio mouse) facendo appare una finestra dove al suo interno sia presente tutto il dettaglio del mio evento e la possibilità di poter cancellare lo stesso magari con un bottone (con la dicitura cancella evento).
Ripeto per il resto funziona tutto bene.24 Luglio 2013 alle 19:27 #4866jqueryitalia
AmministratoreDovi utilizzare le funzionalità “Clicking & Hovering” di FullCalendar creando una funzione di callback.
Guarda la documentazione a questo indirizzo ed il seguente esempio.
Buon lavoro!
- AutorePost
- Devi essere connesso per rispondere a questo topic.