jQuery FullCalendar调用填充数据方法失败

Question

我目前正在ASP.NET MVC3（Razor）中的一个小网站上工作，我需要一个显示日历的页面，其中包含一些约会。

我选择了FullCalendar，遇到了一些麻烦。我通过将日历注入<div>，使其显示良好。

但是，当我尝试添加"events"属性以便调用我的填充数据方法时，日历甚至不会显示，自然我永远不会访问控制器中的方法。即使我试图添加一个标题部分来操作标题和导航箭头，它也不会呈现。

我已经在我的主页中包含了所有必要的脚本，这里是索引视图的源视图，您可以看到包含的所有脚本。

我不明白我做错了什么。我应该能够很好地呈现HTML并调用该方法，这样我就可以在日历中获得一些约会。

还有为什么我不能做一个简单的操作，比如修改标题和将标题定位在我想要的位置。我的语法一定被破坏了吗？

   <title>Index</title>
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="/css/jquery.lightbox-0.5.css" rel="Stylesheet" type="text/css" media="screen" />
<link href="/Content/fullcalendar.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery-ui-1.8.11.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.js" type="text/javascript"></script>
    <script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
    <script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.unobtrusive-ajax.min.js" type="text/javascript">  </script>
    <script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
    <script src="/Scripts/fullcalendar.min.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.lightbox-0.5.min.js" type="text/javascript"></script>
    <script src="/Scripts/Venatores.js" type="text/javascript"></script>

数据模型：

 public class EventModel
{
    public int ID { get; set; }
    public string Title { get; set; }
    public DateTime StartDateTime { get; set; }
    public DateTime EndDateTime { get; set; }
    public bool IsAllDay { get; set; }
}

名为CalendarController:的控制器

        public ActionResult Index()
    {
        return View();
    }

    public JsonResult PopulateData(double start, double end)
    {
      //  var startDateTime = FromUnixTimestamp(start);
       // var endDateTime = FromUnixTimestamp(end);
        EventModel appointment = new EventModel();
        appointment.StartDateTime = DateTime.Now;
        appointment.EndDateTime = appointment.StartDateTime.AddHours(2.0);
        appointment.IsAllDay = false;
        appointment.Title = "Riffel";
        appointment.ID = 1;
        List<EventModel> appointments = new List<EventModel>();
        appointments.Add(appointment);
        var clientList = new List<object>();
        foreach (EventModel e in appointments)
        {
            clientList.Add(
                new
                    {
                        id = e.ID,
                        title = e.Title,
                        //description = e.Description,
                        start = ToUnixTimespan(e.StartDateTime),
                        end = ToUnixTimespan(e.EndDateTime),
                        allDay = e.IsAllDay,
                        url = "www.google.com"
                });
        }
        return Json(clientList.ToArray(), JsonRequestBehavior.AllowGet);
    }
    private static DateTime FromUnixTimestamp(double timestamp)
    {
        var origin = new DateTime(1970, 1, 1, 0, 0, 0, 0);
        return origin.AddSeconds(timestamp);
    }
    private long ToUnixTimespan(DateTime date)
    {
        TimeSpan tspan = date.ToUniversalTime().Subtract(
        new DateTime(1970, 1, 1, 0, 0, 0));
        return (long)Math.Truncate(tspan.TotalSeconds);
    }

我的索引视图：

<script type="text/javascript" language="javascript">
$(document).ready(function () {
    $('#calendar').fullCalendar({
            //events: "/Calendar/PopulateData"
        });
    });
</script>
<h2>Index</h2>
<div id="calendar"></div>

Answer 1

我不在ASP中工作，但是，如果您想使用服务器端JSON回调，FullCalendar API似乎需要"url"设置。"事件"设置用于客户端数组或函数填充。除此之外，从表面上看，其余大部分看起来都很有意义。