Get draggable object in the ui object on drop - jquery-ui

Question

When using jQuery-UI's droppable widget, the drop function returns an "ui" object in which you can access to a "draggable" object which is the DOM element of the dragged object. But with the fullCalendar's drop function, i get the "ui" object without the "draggable" one. Here's a JSFiddle in which you can test what i'm talking about : http://jsfiddle.net/vfaethbd/
$('#calendar').fullCalendar({
header: {
left: 'title',
center: 'agendaDay,agendaWeek,month',
right: 'today prev,next'
},
droppable: true,
drop: function (date, jsEvent, ui) {
alert(JSON.stringify(ui, null, 4));
}
});
$("#droppable-area").droppable({
drop: function (event, ui) {
alert(JSON.stringify(ui, null, 4));
}
});
/* returns "draggable": {
"0": {
"jQuery111104109880250544967": 6
},
"context": {
"jQuery111104109880250544967": 6
},
"length": 1
}
*/
If you drop an event in the calendar, you won't have the draggable object, but if you drop it in the other droppable area you'll get it, since this one uses jQuery-UI.
Thanks

Answer 1

Implement what the external dragging example has in the drop callback:
drop: function(date) { // 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;
// 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();
}
}
Full code example here and documentation about external events here.
Also, make sure your events and calendar are editable, for events this include:
allDay
durationEditable
startEditable
if not it may seem like your events lost the drag option