1

我正在尝试使用最新版本的 fullcalendar 脚本更新fullcalendar-asp-net项目。该项目使用 1.4.7 版本的 fullcalendar(很旧)和 jquery 1.3.2(也很旧)。我喜欢该项目的全部功能,所以我只想通过使用 jquery 1.10.2 将其更新到 1.6.4(最新)版本的 fullcalendar(最新版本随 jquery 版本一起提供)来使用它。

我遇到的问题是,当我更新脚本时,我无法让事件从处理程序中出现。我所做的唯一更改是更改页眉处的脚本,例如:

  • jQuery 1.3.2 到 1.10.2
  • Jquery-UI 到 1.10.3
  • FullCalendar 1.4.7 到 1.6.4

所有后端方法都工作正常,所以我可以添加新事件并将它们保存到数据库并毫无问题地更新它们。当我重新加载页面时,它们都消失了(意味着它们没有加载)。那是应该在页面加载时加载日历的 js 代码(为简化起见,删除了不必要的代码)。

var calendar = $('#calendar').fullCalendar({
    events: "JsonResponse.ashx",
})

奇怪的是,当我将 json 响应直接复制并粘贴到事件时,它们都出现了。代码是这样的:

var calendar = $('#calendar').fullCalendar({
    events: [{ id: '42', title: 'asdf', start: 1378771200, end: 1378944000, allDay: true, description: 'asdfasdf' },
        { id: '43', title: 'sadfsdf', start: 1378944000, end: 1379030400, allDay: true, description: 'asdfgadfasdfd' },
        { id: '44', title: 'asdf', start: 1379030400, end: 1379030400, allDay: true, description: 'asdfasdf' }]
})

我开始认为fullcalendar 1.4.7 和1.6.4 版本之间,加载事件应该有区别。当我查看文档时,我看到的和我看到的完全一样。这个想法不只是向事件发送一个 JSON 字符串吗?ashx 处理程序生成的 JSON 字符串是正确的,因此当我直接复制和粘贴它时它可以工作。

我在这里有点迷路,浪费了足够的时间搜索相关信息和阅读基础知识。终于来到这里希望有人能指出我正确的方向。

注意:我没有编写 ashx 代码,认为它不重要,因为它创建了一个有效的 JSON 字符串,并且可以从fullcalendar-asp-net项目中找到。

谢谢!

4

1 回答 1

2

最后,我最终修改了“ fullcalendar-asp-net ”项目中的原始 ashx 处理程序。我没有在 foreach 循环中将事件添加到字符串中,而是创建了一个事件列表并使用此代码将其转换为 Json 字符串。

System.Web.Script.Serialization.JavaScriptSerializer oSerializer =
   new System.Web.Script.Serialization.JavaScriptSerializer();
   string sJSON = oSerializer.Serialize(tasksList);

   context.Response.Write(sJSON);

完整的 ashx 代码是这样的。

/// <summary>
/// Summary description for JsonResponse
/// </summary>
public class JsonResponse : IHttpHandler, IRequiresSessionState
{
    public void ProcessRequest(HttpContext context)
    {
        context.Response.ContentType = "text/plain";

        //CONVERT FROM UTC TIMESTAMP TO LOCAL DATETIME
        DateTime start = ConvertFromTimeStamp(long.Parse(context.Request.QueryString["start"]));
        DateTime end = ConvertFromTimeStamp(long.Parse(context.Request.QueryString["end"]));

        List<int> idList = new List<int>();
        List<ImproperCalendarEvent> tasksList = new List<ImproperCalendarEvent>();

        //GENERATE JSON SERIALIZABLE EVENTS
        foreach (CalendarEvent cevent in EventDAO.getEvents(start, end))
        {
            tasksList.Add(new ImproperCalendarEvent
            {
                id = cevent.id,
                title = cevent.title,
                start = ConvertToTimestamp(Convert.ToDateTime(cevent.start).ToUniversalTime()).ToString(),
                end = ConvertToTimestamp(Convert.ToDateTime(cevent.end).ToUniversalTime()).ToString(),
                description = cevent.description,
                allDay = cevent.allDay,
            }
                );
            idList.Add(cevent.id);
        }

        context.Session["idList"] = idList;

        //SERIALIZE EVENTS TO STRING
        System.Web.Script.Serialization.JavaScriptSerializer oSerializer =
         new System.Web.Script.Serialization.JavaScriptSerializer();
        string sJSON = oSerializer.Serialize(tasksList);

        //WRITE JSON TO RESPONSE OBJECT
        context.Response.Write(sJSON);
    }

    /// <summary>
    /// Converts a UTC transformed timestamp into a local datetime
    /// </summary>
    /// <param name="timestamp"></param>
    /// <returns></returns>
    private DateTime ConvertFromTimeStamp(long timestamp)
    {
        long ticks = (timestamp * 10000000) + 621355968000000000;
        return new DateTime(ticks, DateTimeKind.Utc).ToLocalTime();
    }

    private static readonly DateTime Epoch = new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc);

    private static long ConvertToTimestamp(DateTime value)
    {
        TimeSpan elapsedTime = value - Epoch;
        return (long)elapsedTime.TotalSeconds;
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

当我问这个问题时,我使用的是 web 方法而不是那个处理程序,所以我调用日历的 js 代码与应有的不同。现在,我使用的方法与 fullcalendar 官方文档中解释的方法完全相同。像;

$('#calendar').fullCalendar({
events: '/myfeed.php', }); // for me, that is "JsonResponse.ashx"

现在它适用于我在问题中提到的所有脚本的最新版本。Jquery 1.10.2、Jquery-UI 1.10.3 和 fullcalendar 1.6.4。而且效果很好!

我希望其他无法解决这个问题的人不会像我一样受苦:)

谢谢!

于 2013-10-04T13:33:15.680 回答