javascript - 使用 MVC 和 JSON 的 jquery FullCalendar

Question

我只是想做一些非常简单的事情。

我正在使用此处找到的 jQuery FullCalendar:http://fullcalendar.io/

当我将事件数据添加为数组(如文档示例提供的)时，日历会填充。但是，当我尝试通过 jQuery 执行此操作时，我得到了有效的 JSON 响应，但该事件未填充。

    $(document).ready(function () {
        // page is now ready, initialize the calendar...
        $('#calendar').fullCalendar({
            events: {
                url: '../calendar/GetCalendarData',
                type: 'GET',
                data: {},
                success: function (doc) {
                        //alert(doc.title + ' ' + doc.start);
                        var events = [];
                        events.push(doc);
                        alert(events[0].title + ' ' + events[0].start);
                },
                error: function() {
                    alert('there was an error while fetching events!');
                },

                color: 'yellow',   // a non-ajax option
                textColor: 'black' // a non-ajax option
            }
        });
        // Code and Documents: http://fullcalendar.io/
    });


    [HttpPost]
    public ActionResult PostCalendarData()
    {
        return Json(new { title = "Free Pizza", allday = "false", borderColor = "#5173DA", color = "#99ABEA", textColor = "#000000", description = "<p>This is just a fake description for the Free Pizza.</p><p>Nothing to see!</p>", start = "2015-01-04T22:00:49", end = "2015-01-01", url = "http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/" });
    }

    [HttpGet]
    public ActionResult GetCalendarData()
    {
        return Json(new { title = "Free Pizza", allday = "false", borderColor = "#5173DA", color = "#99ABEA", textColor = "#000000", description = "<p>This is just a fake description for the Free Pizza.</p><p>Nothing to see!</p>", start = "2015-01-04T22:00:49", end = "2015-01-01", url = "http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/" }, JsonRequestBehavior.AllowGet);
    }

我从 GetCalendarData 调用中得到的响应如下:

{"title":"Free Pizza","allday":"false","borderColor":"#5173DA","color":"#99ABEA","textColor":"#000000","description":"\u003cp\u003eThis is just a fake description for the Free Pizza.\u003c/p\u003e\u003cp\u003eNothing to see!\u003c/p\u003e","start":"2015-01-04T22:00:49","end":"2015-01-01","url":"http=//www.mikesmithdev.com/blog/worst-job-titles-in-internet-and-info-tech/"}

我在 Stack 上看到其他人也有类似的问题，但我没有看到有关如何在此日历中使用 AJAX 和 JSON 的示例。

我还尝试使用 eventSources: Documentation/example 获得相同的结果。

更新:

我根据我尝试过的不同事情更新了我的代码。仍然没有运气。我查看了日期格式。我尝试过系统生成的日期，但我看到的所有内容似乎都指向基于字符串的日期(这是我在更新的代码中尝试过的)。不幸的是，这仍然不起作用(至少对我来说)。

仍在寻求帮助。

Answer 1

我不知道这对你来说是否仍然是一个问题，但我确实设法让它对我有用。我有一个几乎完全相同的案例。这是我的例子:

[HttpGet]
public JsonResult SerializeEvent(int id)
{
    var sesh = Umbraco.TypedContent(id).Descendants("courseSession");
            var eventList = new List<EventModel>();
            foreach (var item in sesh)
            {
                var eventObj = new EventModel();
                eventObj.start = item.GetPropertyValue<DateTime>("startDate").ToString("yyyy-MM-dd");
                eventObj.end = item.GetPropertyValue<DateTime>("endDate").ToString("yyyy-MM-dd");
                eventObj.title = item.Parent.Name;
                eventObj.url = item.Parent.Url;

                eventList.Add(eventObj);
            }           

            return Json(eventList, JsonRequestBehavior.AllowGet);
}

对我来说，不同之处在于将方法返回类型从 ActionResult 更改为 JsonResult，并添加第二个参数“JsonRequestBehavior.AllowGet” "到返回函数。

希望这有帮助。