事件未显示在fullcalendar js中

Question

请任何人帮助我找出代码中的错误。我使用fullcalendar.js作为日历事件。

我想在日历中显示事件。下面是我的代码。

    $(document).ready(function() {
        $(window).resize(function() {
            $('#calendar').fullCalendar('option', 'height', get_calendar_height());
        });
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();
        var nevent = [];
        
        nevent = document.getElementById('<%=hdnevent.ClientID%>').value;
        
       
       // alert(nevent);
        var calendar = $('#calendar').fullCalendar({
            theme: true,
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay',
                width: get_calendar_width
            },
            width: get_calendar_width,
            height: 480,
            selectable: true,
            selectHelper: true,
            slotMinutes: 15,
            allDayDefault: false,
            //  events: 'JsonResponse.ashx',
            events: nevent
     });
    });

nevent值为：

[{ id: '2302', title: 'XXX', start: '4/4/2014 12:00:00 AM', end: '4/4/2014 12:00:00 AM', allDay: true, url: 'xxx'}]

但它不显示在日历中。如果我直接赋值，那么它会显示事件。

示例：

events: [
    { 
        id: '2302', 
        title: 'XXX', 
        start: '4/4/2014 12:00:00 AM', 
        end: '4/4/2014 12:00:00 AM', 
        allDay: true, 
        url: 'xxx'
    }
]

请帮我改正错误。

Answer 1

需要告知日历在数据更改后进行更新。尝试：

$("#calendar").fullCalendar('removeEvents');
$("#calendar").fullCalendar('addEventSource', nevent);
$("#calendar").fullCalendar('rerenderEvents');

当nevent准备好了。

编辑：

接受输入为JSON对象而不是字符串：

nevent = $.parseJSON(document.getElementById('<%=hdnevent.ClientID%>').value);

请注意，JSON的格式必须正确，并带有引号，如：

[{ "id": "2302", "title": "XXX", "start": "4/4/2014 12:00:00 AM", "end": "4/4/2014 12:00:00 AM", "allDay": true, "url": "xxx"}]

Answer 2

在nevent值中，start（和end）根据文档应为："您可以指定IETF格式的字符串（例如："2009年10月18日星期三13:00:00 EST"）、ISO8601格式的字符串，例如："2009-11-05T13:15:30Z"）或UNIX时间戳"

所以你必须转换日期。

Answer 3

我在日历应用程序中尝试过这种方式。看来你的日期格式不对。应该是

[{ id: '2302', start: new Date(2014, 1, 3, 12, 0), end: new Date(2014, 4, 4, 12, 0) ,allDay: true, url: 'xxx'}]

希望这能有所帮助。

Answer 4

对我来说，有些事件根本没有显示，因为我定义了timezone参数。仍然不确定为什么，但当我删除这个参数时，它们出现了。