fullcalendar动态添加事件

anu*_*bis 9 javascript jquery fullcalendar

我正在尝试动态创建完整日历中的事件.

我有:

$('#calendar').fullCalendar({
                viewRender: function (view) {

                    var h;
                    if (view.name == "month") {
                        h = NaN;
                    }
                    else {
                        h = 2500; // high enough to avoid scrollbars
                    }


                    $('#calendar').fullCalendar('option', 'contentHeight', h);
                },
                lang: 'fr',
                events: [
                    {
                        title: '8 présents',
                        start: data[0]
                    },
                    {
                        title: '8 excusés',
                        start: data[1]
                    },
                    {
                        title: '8 excusés',
                        start: '2015-01-08'
                    },
                    {
                        title: '8 présents',
                        start: '2015-01-08'
                    },
                ],
                dayClick: function (date, jsEvent, view) {
                    window.location.replace(Routing.generate('dateChoisie', {date: date.format()}));
                }
            })
Run Code Online (Sandbox Code Playgroud)

我有一个var数据,这是一个包含事件所有日期的数组.我想以与插入数据[0],数据[1]等相同的方式在事件中插入它,但是动态地为所有日期插入.

我试过做一个for:

events: [
    for (var i = 0, max = data.Lenght; i < max; i++) {
         {
                 title: '8 présents',
                 start: data[i]
           },
    }
                                {
                                    title: '8 excusés',
                                    start: data[1]
                                },
                                {
                                    title: '8 excusés',
                                    start: '2015-01-08'
                                },
                                {
                                    title: '8 présents',
                                    start: '2015-01-08'
                                },
                            ],
Run Code Online (Sandbox Code Playgroud)

但它在列表中不起作用.

谁知道我怎么能这样做?

Moh*_*eer 36

渲染完整日历后,您可以动态添加事件.

var event={id:1 , title: 'New event', start:  new Date()};

$('#calendar').fullCalendar( 'renderEvent', event, true);
Run Code Online (Sandbox Code Playgroud)

  • 使用此方法,我发现导航到新视图时会丢失事件.如果我在每周观看并向前推进一周,然后返回导航,则事件不再存在. (4认同)

anu*_*bis 8

我正在寻找一段时间,我发现了一种可能性.

最后这很容易......

我在这里说,也许任何人都有兴趣.

for (var i in data)

    var monthSource = new Object();
    monthSource.title = data[i]+' présents'; 
    monthSource.start = i; // this should be date object
    monthSource.end = new Date(y, m, d); //to now
    month[a] = monthSource;
    a++;

    }
$('#calendar').fullCalendar({
viewRender: function (view) {

    $('#calendar').fullCalendar( 'removeEvents');
    $('#calendar').fullCalendar('addEventSource', month);
}
Run Code Online (Sandbox Code Playgroud)


Mar*_*ard 5

来源:http : //fullcalendar.io/docs/event_data/addEventSource/

您可以动态添加事件源。事件源是一个网址,例如可以返回json数据。

refetch更改事件数据后,激发事件可能就足够了。

.fullCalendar( 'refetchEvents' )
Run Code Online (Sandbox Code Playgroud)

资料来源:http : //fullcalendar.io/docs/event_data/refetchEvents/