fullCalendar jQuery,每个星期一重复?

时间:2012-06-17 15:43:06

标签: jquery fullcalendar

通常这是日历中的事件:

            {

                title: 'Test',

                start: '2012-06-08',

                end: '2012-06-08',

                url: 'test/test'

            },

工作正常。虽然如何在日历中的每个星期一制作1个活动?或者每个星期二等等取决于您输入的工作日/数字?如果有一个参数是什么?

如果它不存在,我可以以某种方式修改并添加该功能以实现此目的吗?所以你可以输入一个像repeatEveryWeekDay:2(这是星期一)的参数,然后在所有未来的星期一,数据将显示在那里。

我试着查看http://arshaw.com/fullcalendar/docs/event_data/Event_Object/但找不到任何内容。

4 个答案:

答案 0 :(得分:35)

fullCalendar允许传递一个函数,而不是传递一系列事件,例如,从服务器下载事件,或动态生成这些事件。

文档中的大多数示例都使用HTTP请求来获取事件数据。但是回调函数仍然足够灵活,可以按照你想要的方式工作。

请看下面我刚刚为您写的示例:

$(document).ready(function() {

    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        events: [
            // some original fullCalendar examples
            {
                title: 'All Day Event',
                start: new Date(y, m, 1)
            },
            {
                title: 'Long Event',
                start: new Date(y, m, d-5),
                end: new Date(y, m, d-2)
            },
            {
                id: 999,
                title: 'Repeating Event',
                start: new Date(y, m, d-3, 16, 0),
                allDay: false
            }
        ]
    });

    // adding a every monday and wednesday events:
    $('#calendar').fullCalendar( 'addEventSource',        
        function(start, end, callback) {
            // When requested, dynamically generate virtual
            // events for every monday and wednesday.
            var events = [];

            for (loop = start.getTime();
                 loop <= end.getTime();
                 loop = loop + (24 * 60 * 60 * 1000)) {

                var test_date = new Date(loop);

                if (test_date.is().monday()) {
                    // we're in Moday, create the event
                    events.push({
                        title: 'I hate mondays - Garfield',
                        start: test_date
                    });
                }

                if (test_date.is().wednesday()) {
                    // we're in Wednesday, create the Wednesday event
                    events.push({
                        title: 'It\'s the middle of the week!',
                        start: test_date
                    });
                }
            } // for loop

            // return events generated
            callback( events );
        }
    );
});

上述功能会自动为两个日期之间的每个星期一和星期三生成一个事件。日期显示在startend参数中。这些参数由fullCallendar传递。上述函数生成的事件将通过第三个参数中的fullCallendar函数返回到callback

我使用DateJS来测试给定日期是否为星期一。

更新:如果您想混合静态事件和/或[多个]可重复事件,可以使用addEventSource

答案 1 :(得分:8)

克里斯托弗拉米雷斯的帖子略有更新。 在v2.2.3使用fullCalendar,在v2.8.4使用momentjs,您需要修改上面代码段中的几行以使其正常工作:

首先:

function(start, end, callback) {}

function(start, end, status, callback) {}

因为第三个参数是布尔值,第四个是回调函数

然后:

for (loop = start.getTime();
     loop <= end.getTime();
...

for (loop = start._d.getTime();
     loop <= end._d.getTime();

因为传递给函数的开始和结束对象不是Date对象,并且对它们调用.getTime()将以'Undefined is not a function'错误结束。

就是这样!这些修正案对我有用。

答案 2 :(得分:1)

它是事件对象的ID字段,用于确定该事件的可重复性。对于一周中特定日期的所有重复事件使用相同的ID。

答案 3 :(得分:1)

我找到解决重复事件的最佳方法是设置对后端语言的JSON调用(我正在使用Django / Python)。

所以在日历选项中我会:

  

事件:{url:'/ event-data',cache:false},

然后在我的后端,我利用了为当前显示的日历发送的参数 '开始'和'结束'URL GET变量。 即:

  

hxxp://示例.com:8000 /事件数据开始= 2014年9月28日&安培;端= 2014-11-09&安培; _ = 1413553318353

将从事件选项发送Get请求,然后我从数据库/源文件中构建事件,列出重复事件以及常规日历事件,并仅返回JSON中该日期范围内发生的事件列表列表。