jQuery FullCalendar渲染事件在月视图中的错误日期

Question

EDIT TL;DR:figured out what was causing the problem temporarily, IE compatibility mode breaks this plugin (v2.5) in IE10 10.0.34

EDIT: I'm a noob it's IE10. Even considering I'd turned off drag and drop and editing IE10 is building it wrong somehow. I do almost all my testing in IE10 as it is the mandated browser for in house web apps, fullcalendar shows IE8+ compatibility on their page so I hadn't tested it across browsers until just now out of desperation/rage. Has anyone had issues with this? Any ideas how I can fix it or how to go about maybe tracing the problem? It's a bit out of my wheelhouse but I want this thing to work and by the Gods I will make it work or die trying.

I was attempting to use fullcalendar as part of a front end for a simple display. The web application is served with Oracle Portal which may have some bearing.

Here is the calendar initialization script, it binds to a div so nothing fancy:

<script>
$(document).ready(function() {
    var events = [];
    var e = {}
    <%FOR event_rec in month_events LOOP%>
    e = {
                id: "<%=event_rec.event_id%>",
                title: "<%=event_rec.event_name%>",
                start: "<%=event_rec.event_day%>T<%=to_char(event_rec.start_hr,'FM00')%>:<%=to_char(event_rec.start_min,'FM00')%>:00",
                end: "<%=event_rec.event_day%>T<%=to_char(event_rec.end_hr,'FM00')%>:<%=to_char(event_rec.end_min,'FM00')%>:00",
                description: "<%=event_rec.notes%>"
        };
    events.push(e);
    <%end LOOP;%>

    $("#calendar").fullCalendar({
        header: {
            left: "prev,next",
            center: "title",
            right: "month,basicWeek,basicDay"
        },
        titleFormat: 'MMMM D, YYYY',
        buttonText: {
            prev: 'Previous',
            next: 'Next'
        },
        defaultDate: "<%=v_default_date%>",
        editable:false,
        allDayDefault:false,
        eventStartEditable:false,
        eventDurationEditable:false,
        eventLimit:true,
        eventOrder:"start", 
        dayClick: function(date, jsEvent, view) {
                //Open day by clicking on tile
                $('#calendar').fullCalendar( 'gotoDate', date );
                $('#calendar').fullCalendar( 'changeView', "basicDay" );
        },
        timezone : 'local'      
    });

    $('#calendar').fullCalendar('addEventSource',events);

});

Those <%= %> tags denote where it's calling the faux code behind that is oracle portal, it is looping through a small cursor which yes, is less than an ideal way to do this but it is all I can do.

It looks like this on page load/render:

e = {
                id: "1",
                title: "Test Event 1",
                start: "2015-12-10T11:00:00",
                end: "2015-12-10T14:00:00",
                description: "Testing Notes"
        };

Now for the fun part:

Image

See those days circled in red? Those days have no events, all the events are on the 10th and 12th. I cannot for the life of me figure out why these events are displaying in the wrong days. First thought was a data issue with that array I'm filling, like something was typed wrong or formatted wrong but all the dates have identical start/end times as I didn't changed those values at first when making test cases.

Any ideas? I'm completely out of them. Usually in these situations it's something small I overlooked, and as soon as I ask for help I spot it. I'm banking on this, or someone smarter than I to spot the screw up.

Answer 1

Compatibility mode in IE10 (10.0.34) breaks the fullcalendar app (or JQuery) from version 2.5, making events render on the wrong date cells in month view but remain correct in date or week views.

Turning it off solved my issue at least for the time being (if you are running legacy apps that require compatibility mode for some cases in a hodgepodge of outdated spaghetti code from hell like I am, this may not be a viable long term fix)