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

时间:2013-07-14 19:14:11

标签: javascript jquery html time fullcalendar

我正在使用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

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

  

ignoretimezone = false(失败,然后尝试将其切换为true)

     

ignoretimezone = true(也失败,然后尝试添加时区)

     

currentTimezone:'亚洲/新加坡'(其效果不佳)

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

            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))

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

  

2013年7月17日星期三00:00:00 GMT + 0800(马来半岛标准时间)

我在我的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

修改的 更改为datetime后,我在数据库中保存了正确的日期。

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

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

通过

  

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

2 个答案:

答案 0 :(得分:2)

时间如何存储在数据库中无关紧要。只关注时间如何通过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中本身没有任何作用。

答案 1 :(得分:1)

在将日期保存到数据库之前,必须将日期转换为格式formatDate。该活动只接受像dd-MM-yyyy 00:00:00这样的格式。

我的select方法中有这个,所以也许你没有正确地获取事件对象。 这对我来说很好。

select: function(start, end, allDay){

      var startdate = $.fullCalendar.formatDate(start, "dd-MM-yyyy");
      var enddate = $.fullCalendar.formatDate(end, "dd-MM-yyyy");     

      alert(startdate);
      alert(enddate);
 }

这将显示日期为15-07-2013。