javascript - 从数据库存储和检索时 FullCalendar 日期不同

Question

我正在使用 FullCalendar，我的事件对象的开始日期存储到数据库中

copiedEventObject.start = date;

我稍后检索它并使用以下方法初始化我的日历:

        $.ajax({
            type: "POST",
            url: "Default.aspx/getCalendarEventsData",
            data: {},
            contentType: "application/json",
            dataType: "json",
            success: function (msg) {
                // Replace the div's content with the page method's return.

                calendarStoredEvents = $.map(msg.d, function (item) {
                    return {
                        title: item.EventTitle,
                        start: item.start,
                        id: item.EventID,
                        staffID: item.staffID
                    };
                });
                initializeCalendar(calendarStoredEvents);
            }
        });

item.start 所在位置:

2013-06-30T16:00:00.000Z

现在的问题是。 如果我在星期三存储事件对象，它会在星期二检索并显示。我读了一点，它与时区有关。我尝试添加:

ignoretimezone = false (which failed, then tried toggling it to true)

ignoretimezone = true (which also failed, then tried to add timezone)

currentTimezone: 'Asia/Singapore' (which didn't work as well)

这是存储在数据库中的值:

            drop: function (date, allDay) { // this function is called when something is dropped

                // retrieve the dropped element's stored Event Object
                var originalEventObject = $(this).data('eventObject');

                // we need to copy it, so that multiple events don't have a reference to the same object
                var copiedEventObject = $.extend({}, originalEventObject);

                // assign it the date that was reported
                copiedEventObject.start = date;
                copiedEventObject.allDay = allDay;

                // render the event on the calendar
                // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
                $('#calendar').fullCalendar('renderEvent', copiedEventObject, true);

                // is the "remove after drop" checkbox checked?
                if ($('#drop-remove').is(':checked')) {
                    // if so, remove the element from the "Draggable Events" list
                    $(this).remove();
                }
                // write to database
                var eventID = copiedEventObject.id;
                var staffID = copiedEventObject.staffID;
                var start = copiedEventObject.start;
                var end = copiedEventObject.end;
                var allDay = copiedEventObject.allDay;

编辑

我的网站托管在 Azure 中，所以我猜时间来自服务器:

当我删除事件时

( drop: function (date, allDay))

我使用了警报(开始)并显示了(我的客户时间)

Wed Jul 17 2013 00:00:00 GMT+0800 (Malay Peninsula Standard Time)

我在后面的 C# 代码中写入数据库:

    string strConnectionString = ConfigurationManager.ConnectionStrings["PCSDB"].ConnectionString;
    SqlConnection conn = new SqlConnection(strConnectionString);
    conn.Open();
    using (SqlCommand sqlCommand = new SqlCommand("INSERT INTO CalendarData (EventID, staffID, start) VALUES (@EventID, @staffID, @start)", conn))
    {
        sqlCommand.Parameters.AddWithValue("@EventID", eventID);
        sqlCommand.Parameters.AddWithValue("@staffID", staffID);
        sqlCommand.Parameters.AddWithValue("@start", start);

        int queryResult = sqlCommand.ExecuteNonQuery();
    }
    conn.Close();

当我检查数据库时，起始值变为

2013-07-16T16:00:00.000Z

编辑 更改为日期时间后，我在数据库中保存了正确的日期。

现在我在将其转换为对象时遇到问题。我用过:

  var parsedDate = $.fullCalendar.parseDate(item.start);
  var formatedDate = $.fullCalendar.formatDate(parsedDate, "dd-MM-yyyy");

已通过

17/7/2013 12:00:00 AM Becomes 07-05-2014

Answer 1

时间如何存储在数据库中并不相关。重要的只是时间如何通过 API 传输到 FullCalendar。假设您提供的确切字符串 "2013-06-30T16:00:00.000Z" 是传递到 FullCalendar 的内容，那么您描述的行为是有意义的。您提供的 UTC 时间正在调整为用户的本地时区。

FullCalendar 显示查看者所在时区的日历。没有设置可以以 UTC 或任何其他时区查看日历。有一些信息here他们提到“与时区无关”。您可以按照日历的绘制方式来思考，但在查看任何 Date 对象时，您始终会看到本地时区，因为这就是 JavaScript 的工作方式。

您有一些选择:

• 设置 ignoreTimezone选项设置为 true，并将输入值作为字符串而不是日期传递。
• 将值作为字符串传递，不带时区偏移(删除 Z)
• 将值作为字符串传递，并为查看数据的人员提供正确的时区偏移量。
• 将值作为已针对本地时区进行调整的 Date 对象传递。

currentTimezone 选项不是 FullCalendar 的一部分。它位于 gcal.js 插件中，用于通过 gcal 1.0 api 将 FullCalender 连接到 Google 日历。它只是将该参数作为查询字符串中的 ctz 传递给 Google。它仅影响从 Google 返回数据的方式。它在 FullCalendar 本身中不执行任何操作。