Question

我无法将FullCalendar jquery插件绑定到来自ASP.NET MVC3操作的Json数组。

我已从代码中删除了几乎所有内容以尝试寻找问题;我留下了这个，从我读过的每篇SO和博客文章中都应该有用：

操作（日历控制器）

    public JsonResult Events(double start, double end)
    {
        var rows = new object[] { new { title="Event1", start= "2011-04-04" }, 
                                  new { title="Event2", start= "2011-04-05" } };
        return Json(rows, JsonRequestBehavior.AllowGet);
     }

查看

  <script type='text/javascript'>
  $(document).ready(function () {
     $('#calendar').fullCalendar({
        events: '@Url.Content("~/Calendar/Events")'
     })
});

结果是空白日历，没有绑定事件。我已经确认正在检索Json：

Json结果

[{"title":"Event1","start":"2011-04-04"},{"title":"Event2","start":"2011-04-05"}]

这很好用：

   $(document).ready(function () {
       $('#calendar').fullCalendar({
           events: [{title: 'Event1',start: '2011-04-04'},
                    {title: 'Event2',start: '2011-04-05'}
                   ]});
   });

我尝试过使用所有数量的日期格式（包括ISO8601和* nix时间戳并得到相同的结果：没有绑定事件，只是一个空白日历。如果我向.fullCalendar对象添加$ .ajax错误：函数，它会发射，所以可能是因为Json被退回了 - 但它看起来很好。

我正在使用FullCalendar 1.5（虽然我也试过1.4.11），JQuery 1.5.1，JQueryUI 1.8.11。

我已经尝试了我能想到的一切 - 非常感谢任何想法！

Answer 1

我介入并发现了问题 - fullcalendar.js和jquery.validate.js之间存在函数名称冲突。

Answer 2

也许不是这样：

return Json(rows, JsonRequestBehavior.AllowGet);

试试这个：

return Json(rows.ToArray(), JsonRequestBehavior.AllowGet);

或者代替：

events: '@Url.Content("~/Calendar/Events")'

试试这个：

events: '@Url.Action("Events", "Calendar")'

Answer 3

使用$ .ajax（）方法。

动作（日历控制器）

    public JsonResult Events(string start, string end)
    {
        //convert string to date
        DateTime _start = DateTime.TryParse(start, out _start) ? _start : DateTime.Now.Date; 
        DateTime _end = DateTime.TryParse(end, out _end) ? _end : DateTime.Now.Date; 

        var rows =
        new object[] { new { title="Event1", start= "2011-04-04" },                                    
        new { title="Event2", start= "2011-04-05" } };
        return Json(rows, JsonRequestBehavior.AllowGet);
    }

查看

    $(document).ready(function () {
    $('#calendar').fullCalendar({

    events: function (start, end, callback) {
        $.ajax({
            url: '@Url.Content("~/Calendar/Events")',
            dataType: 'json',
            data: {
                start: start.toLocaleString("yyyy-mm-dd"),
                end: end.toLocaleString("yyyy-mm-dd")
            },  

            success: function (doc) {
                var events = [];
                $.each(doc, function (key, val) {
                    events.push({
                        title: val.title,
                        start: val.start, 
                        url: 'http://google.com'
                    });
                });  

                callback(events); 
            }  
        });  
    }  
    });  
    })

希望这会有所帮助。

FullCalendar不会绑定到ASP.NET MVC3 Action的Json提要

3 个答案: