Geek asks and answers

Events are not loaded with events in the full calendar

I load events like this:

events: function(start, end, callback) {
    var today = $('#calendar').fullCalendar('getDate');
    $.ajax({
        url: '/admin/customer/order/get-order/',
        dataType: 'json',
        data: {
            today: today,
        },
        success: function(data) {
            var events = [];
            for(order in data){
                events.push({
                    id: data[order].id,                                
                    title: data[order].title,
                    start: data[order].start,
                    end: data[order].end,
                    resourceId: data[order].resourceId,
                    allDay: data[order].allDay,
                    color: data[order].color,
                });
            }
            callback(events);
       }
    });
},

Yes, there is event data and the correct format for the start and end dates. What's wrong? Event not loaded.

+3
source share
2 answers

You pass the parameter today to your server

data: {
    today: today,
},

should not be a parameter for the start and end dates according to the example

data: {
    // our hypothetical feed requires UNIX timestamps
    start: Math.round(start.getTime() / 1000),
    end: Math.round(end.getTime() / 1000)
},

also, if possible, insert an example server-server response for debugging.

+1
source

Try it.

jQuery(document).ready(function() {
      $.ajax({
           type: "POST",
           contentType: "application/json",
           data: "{}",
           url: '/WebService/FullcalenderwithWebservice.asmx/GetEvents',
           dataType: "json",
           success: function(data) {
                $('div[id*=fullcal]').fullCalendar({
                    theme: true,
                    header: {
                        left: 'prev,next today',
                        center: 'title',
                        right:'' //'month,agendaWeek,agendaDay'
                    },
                    editable: false,
                    events: $.map(data.d, function(item, i) {
                        var event = new Object();
                        event.id = item.EventID;
                        event.start = new Date(item.StartDate);
                        event.end = new Date(item.EndDate);
                        event.title = item.EventName;
                        event.backgroundColor = item.backgroundColor +" !Important";
                        event.description = item.description;
                        return event;
                     }),
                     eventMouseover: function(calEvent, jsEvent) {
                         $(jsEvent.target).css('cursor','pointer');
                         var tooltip = '<div class="tooltipevetn" style="width:50%;cursor:pointer;position:absolute;z-index:10001;"><b>Event Name : ' + calEvent.title +'</b><br/><p style="text-align:justify">'+calEvent.description + '</p></div>';
                        $("body").append(tooltip);
                        $(this).mouseover(function(e) {
                            $(this).css('z-index', 10000);
                            $('.tooltipevetn').fadeIn('500');
                            $('.tooltipevetn').fadeTo('10', 1.9);
                        }).mousemove(function(e) {
                            $('.tooltipevetn').css('top', e.pageY + 10);
                            $('.tooltipevetn').css('left', e.pageX + 20);
                        });
                    },
                    eventMouseout: function(calEvent, jsEvent) {
                        $(this).css('z-index', 8);
                        $('.tooltipevetn').remove();
                    },
                });
                $("div[id=loading]").hide();
                $("div[id=fullcal]").show();
            },
            error: function(XMLHttpRequest, textStatus, errorThrown) {
                alert(textStatus + " : \n" + errorThrown)
                debugger;
           }
      });
 });
0
source

More articles:


All Articles