0
  /* initialize the calendar
         -----------------------------------------------------------------*/
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth(); 
        var y = date.getFullYear();

        /* selects the events to load in the calendar
         -----------------------------------------------------------------*/
        $.ajax({
            url: 'process.php',
            type: 'POST',
            data: 'type=fetch',
            async: false,
            success: function(response){
                json_events = response;
           }
        });

        $('#calendar').fullCalendar({

            //events: [{"id":"14","title":"New Event","start":"2015-01-24T16:00:00+04:00","allDay":false}],
            events: JSON.parse(json_events),
            utc: true,
            defaultView: 'agendaWeek',
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay'
            },
            editable: true,
            droppable: true, 
            slotDuration: '00:30:00',
            timezone: 'local',
            eventReceive: function(event){
                var title = event.title;
                var start = event.start.format("YYYY-MM-DD[T]HH:mm:SS");
                $.ajax({
                    url: 'process.php',
                    data: 'type=new&title='+title+'&startdate='+start+'&zone='+zone,
                    type: 'POST',
                    dataType: 'json',
                    success: function(response){
                        event.id = response.eventid;
                        $('#calendar').fullCalendar('updateEvent',event);
                    },
                    error: function(e){
                        console.log(e.responseText);

                    }
                });
                $('#calendar').fullCalendar('updateEvent',event);
                console.log(event);
            },
            eventDrop: function(event, delta, revertFunc) {
                var title = event.title;
                var start = event.start.format();
                var end = (event.end == null) ? start : event.end.format();
                $.ajax({
                    url: 'process.php',
                    data: 'type=resetdate&title='+title+'&start='+start+'&end='+end+'&eventid='+event.id,
                    type: 'POST',
                    dataType: 'json',
                    success: function(response){
                        if(response.status != 'success')                            
                        revertFunc();
                    },
                    error: function(e){                     
                        revertFunc();
                        alert('Error processing your request: '+e.responseText);
                    }
                });
            },
            eventClick: function(event, jsEvent, view) {
                console.log(event.id);
                  var title = prompt('Event Title:', event.title, { buttons: { Ok: true, Cancel: false} });
                  if (title){
                      event.title = title;
                      console.log('type=changetitle&title='+title+'&eventid='+event.id);
                      $.ajax({
                            url: 'process.php',
                            data: 'type=changetitle&title='+title+'&eventid='+event.id,
                            type: 'POST',
                            dataType: 'json',
                            success: function(response){    
                                if(response.status == 'success')                            
                                    $('#calendar').fullCalendar('updateEvent',event);
                            },
                            error: function(e){
                                alert('Error processing your request: '+e.responseText);
                            }
                        });
                  }
            },
            eventResize: function(event, delta, revertFunc) {
                console.log(event);
                var title = event.title;
                var end = event.end.format();
                var start = event.start.format();
                $.ajax({
                    url: 'process.php',
                    data: 'type=resetdate&title='+title+'&start='+start+'&end='+end+'&eventid='+event.id,
                    type: 'POST',
                    dataType: 'json',
                    success: function(response){
                        if(response.status != 'success')                            
                        revertFunc();
                    },
                    error: function(e){                     
                        revertFunc();
                        alert('Error processing your request: '+e.responseText);
                    }
                });
            },
            eventDragStop: function (event, jsEvent, ui, view) {
                if (isElemOverDiv()) {
                    var con = confirm('Are you sure to delete this event permanently?');
                    if(con == true) {
                        $.ajax({
                            url: 'process.php',
                            data: 'type=remove&eventid='+event.id,
                            type: 'POST',
                            dataType: 'json',
                            success: function(response){
                                console.log(response);
                                if(response.status == 'success'){
                                    $('#calendar').fullCalendar('removeEvents');
                                    getFreshEvents();
                                }
                            },
                            error: function(e){ 
                                alert('Error processing your request: '+e.responseText);
                            }
                        });
                    }   
                }
            }
        });

I have this code to fetch events from database

if($type == 'fetch')
{
    $events = array();
    $query = mysqli_query($con, "SELECT * FROM calendar");
    while($fetch = mysqli_fetch_array($query,MYSQLI_ASSOC))
    {
    $e = array();
    $e['id'] = $fetch['id'];
    $e['title'] = $fetch['title'];
    $e['start'] = $fetch['startdate'];
    $e['end'] = $fetch['enddate'];

    $allday = ($fetch['allDay'] == "true") ? true : false;
    $e['allDay'] = $allday;

    array_push($events, $e);
    }
    echo json_encode($events);
}

I am using this to display event fetched from database

events: JSON.parse(json_events)

When I press F12 then under network tab, my events are all there, my problem is, it is not displaying inside the calendar.
So I think my query my query is right, but the events are not displaying inside the calendar.

I have been doing this for about 3 weeks, hope you could help me with this, I cannot find any solution to solve this problem. Thank You.

1
Contributor
0
Replies
12
Views
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.