jQuery 完整日历 - 事件时间在页面加载时未正确绑定

Question

问题： 在 document.ready 上，完整日历绑定所有事件详细信息，包括开始和结束日期，但不包括时间，即事件在适当的日期槽中呈现正如预期的那样，但不在适当的时间段。

Default.aspx: 渲染完整日历。

    $('#calendar').fullCalendar({
    theme: true,
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultView: 'agendaWeek',
    eventClick: updateEvent,
    selectable: true,
    selectHelper: true,
    select: selectDate,
    editable: true,
    events: "JsonResponse.ashx",
    eventDrop: eventDropped,
    eventResize: eventResized,
    eventRender: function(event, element) {
    //alert(event.title);
        element.qtip({
            content: {
                text: qTipText(event.start, event.end, event.description),
                title: '<strong>' + event.title + '</strong>'
            },
            position: {
                my: 'bottom left',
                at: 'top right'
            },
            style: { classes: 'qtip-shadow qtip-rounded' }
        });
    }
    });

注意：请找到随附的数据库快照，default.aspx & JsonResponse.ashx json 结果。

在 Default.aspx 中，事件 1 在数据库中有开始和结束时间 - 12:00:00 上午到 1:00:00 上午，但它呈现在 06:30:00 - 07:00:00 下插槽不正确。

任何帮助将不胜感激。

提前致谢

Answer 1

Event1 开始时间是 Date(1457893800000)，等于 2016 年 3 月 13 日星期日 18:30:00 GMT。

因此，这可能是时区问题：您的日历以 GMT 显示事件，而您需要它以当地时间显示。

我的建议是保持数据库中的时间值不变，即 UTC 时间，并在浏览器中处理本地时间的转换。

请参阅 FullCalendar 文档中的 timezone 以获取更多建议。

Answer 2

检查你的代码后我发现问题是你在哪里更改时间你在哪里保存到数据库设置 .ToUniversalTime()
因此，当您在日历中 select 早上 7 点时，它会将上午 11 点保存到数据库中。

        start = Convert.ToDateTime(improperEvent.start).ToUniversalTime(),
        end = Convert.ToDateTime(improperEvent.end).ToUniversalTime(),

如果您只是在开始和结束日期删除 .ToUniversalTime()，它会将正确的日期和时间保存到数据库中，当然还会在刷新后加载正确的日期和时间。

        start = Convert.ToDateTime(improperEvent.start),
        end = Convert.ToDateTime(improperEvent.end),

jQuery 完整日历 - 事件时间在页面加载时未正确绑定

jQuery Full Calendar - Event time is not binded correctly on page load

.net

asp.net

jquery

asp.net-ajax

fullcalendar