完整日历保存事件

时间:2014-03-07 17:00:22

标签: javascript jquery fullcalendar

我在使用fullcalendar保存结束时间时遇到了一些问题,并且可以将其拖到日历上超过一天。我已将它设置为通过jQuery.post将数据保存到我的数据库,但我似乎无法弄清楚如何获得最终值以填充以及将其拖动超过一天的能力。这是我的代码:

var calendar = $('#calendar').fullCalendar({
             header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,agendaWeek,agendaDay',
             },

             editable: true,
             selectable: true,
             selectHelper: true,

             select: function (start, end, allDay) {
                 var title = prompt('Event Title:');

                 if (title) {
                     calendar.fullCalendar('renderEvent', {
                         title: title,
                         start: start,
                         end: end,
                     }, true);
                 }

                 calendar.fullCalendar('unselect');
             },

             eventDrop: function (event, dayDelta, minuteDelta) {
                 alert(event.title + ' was saved!');

                 jQuery.post(
                    '/event/save', 
                    {
                        title: event.title,
                        start: event.start,
                        end:   event.end
                    }
                 );
             }
        });

任何帮助将不胜感激!谢谢

(如果能帮助任何人确定问题,我也可以提供网址)

1 个答案:

答案 0 :(得分:5)

您的代码看起来不错。它几乎就在那里。您需要实现eventResize以保存跨越日期拖动事件的效果。理想情况下,创建一个函数来发布数据并从每个事件中调用它。

function saveMyData(event) {
    jQuery.post(
        '/event/save', 
        {
            title: event.title,
            start: event.start,
            end:   event.end
        }
    );
}

...
select: function (start, end, allDay) {
            var title = prompt('Event Title:');
            if (title) {
                calendar.fullCalendar('renderEvent', {
                    title: title,
                    start: start,
                    end: end,
                    }, true);
                }

                calendar.fullCalendar('unselect');
                saveMyData({'title': title, 'start': start, 'end': end});
            },

eventDrop: function (event, dayDelta, minuteDelta) {
               saveMyData(event);
           },

eventResize: function (event, dayDelta, minuteDelta) {
                 saveMyData(event);
             }
...