I have the ability to drag and drop external events to the calendar with the default behavior of start time being where the event was dropped. I would like to set the default behavior to also set the end time for the event to be 1 hour after the start time. This seems trivial but I can't seem to get it working. Below is my drop function (essentially the droppable items demo plus 1 line.)
drop: function(date, allDay) { // this function is called when something is dropped
// retrieve the dropped element's stored Event Object
var originalEventObject = $(this).data('eventObject');
// we need to copy it, so that multiple events don't have a
// reference to the same object
var copiedEventObject = $.extend({}, originalEventObject);
// assign it the date that was reported
copiedEventObject.start = date;
copiedEventObject.end = date.setHours(date.getHours()+1); // <- should be working
copiedEventObject.allDay = allDay;
// render the event on the calendar
// the last `true` argument determines if the event "sticks"
// (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
// is the "remove after drop" checkbox checked?
if ($('#drop-remove').is(':checked')) {
// if so, remove the element from the "Draggable Events" list
$(this).remove();
}
},
Any ideas?
Thanks, Joe Chin
The problem in that example for what you're trying to do is that allDay
is set to true, so it ignores the hours specified in the start date. If you were happy with say the time being midnight - 1am as the default, here's what you could do:
var tempDate = new Date(date); //clone date
copiedEventObject.start = date;
copiedEventObject.end = new Date(tempDate.setHours(tempDate.getHours()+1)); // <-- make sure we assigned a date object
copiedEventObject.allDay = false; //< -- only change
....
EDIT: OK, I actually tried this version. It seems to work.