FullCalendar5 D&Dによる時刻選択でイベントを登録する方法

マウスのドラッグ&ドロップでイベントを登録するには、selectイベントを使う。

        select: function(start, end) {

            // 開始時刻と終了時刻を抽出
            let start_time = moment(start.startStr).format('YYYY-MM-DD HH:mm:ss');
            let end_time = moment(start.endStr).format('YYYY-MM-DD HH:mm:ss');

            calendar.addEvent({
                id: イベントid,
                title: "タイトル",
                start: start.startStr,
                end: start.endStr,
            });
        }

これで画面(タイムスケジュール)上には、イベントが登録される。
実際にはAjaxでDBに登録などしないとほぼ使い道はない。

イベントidは無くても登録できるが、後からイベントの操作をする時に必要となる為、一意となるidを割り当てておいた方が良い。

返信を残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です