web-dev-qa-db-ja.com

fullCalendar jQuery、毎週月曜日に繰り返しますか？

通常、これはカレンダーのイベントです。

            {

                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/ を調べてみましたが、何も見つかりません。

jqueryfullcalendar
12
Karem

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 );
        }
    );
});

上記の関数は、2つの日付の間の毎週月曜日と水曜日のイベントを自動的に生成します。日付はstartおよびendパラメーターで示されます。これらのパラメータはfullCallendarによって渡されます。上記の関数によって生成されたイベントは、3番目のパラメーターのfullCallendar関数を介してcallbackに返されます。

DateJS を使用して、特定の日付が月曜日かどうかをテストします。

[〜＃〜] update [〜＃〜]：静的イベントや[複数の]繰り返し可能なイベントを混在させたい場合は、次のことができます。 addEventSource を使用します。

35
Christopher Ramírez

ChristopherRamírezの投稿を少し更新しました。 v2.2.3でfullCalendarを使用し、v2.8.4でmomentjsを使用するには、上記のスニペットの数行を修正して機能させる必要があります。

最初：

function(start, end, callback) {}

に

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

3番目のパラメーターはブール値であり、4番目はコールバック関数であるため

次に：

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

に

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

関数に渡される開始オブジェクトと終了オブジェクトはDateオブジェクトではなく、それらに対して.getTime（）を呼び出すと、「未定義は関数ではありません」というエラーが発生します。

以上です！この修正は私のためにそれを機能させました。

8
Belgor

繰り返しイベントを解決するために私が見つけた最善の方法は、バックエンド言語へのJSON呼び出しを設定することです（私はDjango/Pythonを使用しています）。

だからカレンダーオプションで私は持っているでしょう：

イベント：{URL： '/ event-data'、キャッシュ：false}、

次に、バックエンドで、現在表示されているカレンダーの「開始」および「終了」URLGET変数に対して送信されるパラメーターを利用します。つまり：

hxxp：//example.com：8000/event-data？start = 2014-09-28＆end = 2014-11-09＆_ = 1413553318353

getリクエストはイベントオプションから送信されます。次に、定期的なカレンダーイベントとともに繰り返しイベントを一覧表示するデータベース/ソースファイルからイベントを作成し、その日付範囲で発生するイベントのリストのみをJSONリストに送り返します。

1
warath-coder

そのイベントの再現性を決定するのは、イベントオブジェクトのIDフィールドです。特定の曜日のすべての繰り返しイベントに同じIDを使用します。

1
ganeshk