jquery fullcalendar drop non event on event

Question

У меня есть проблема перетащить элемент (его не событие, его имя сотрудника) на событие.

Я хочу перетащить сотрудника (см. Рисунок) на мероприятие, но «работником» является нет события. Я использую jquery UI draggable/droppable.

<script> 
var calendar; 
$(document).ready(function() { 
    calendar = $('#calendar').fullCalendar({ 
    droppable: true, 
    dropAccept: '.employeeItem',  
    drop: function(date, allDay, jsEvent, ui) { 

} 
}); 
}); 

$(function() { 
$(".employeeItem").draggable(); 
$(".fc-event").droppable({ 
    drop: function(event, ui) { 

    } 
}); 
}); 
</script> 

<?php for($i=1;$i<=30;$i++){?> 
    <div>Simpson, Homer<br> 
     10/14 h 
    </div> 
<?php }?> 

<div id='calendar'></div> 

После удаления работника на событии, мне нужно соответствующие данные события (событие-идентификатор и т.д.), чтобы сохранить процесс в БД. Но jquery fullcalendars «drop (callback)» предоставляет только дату, когда элемент был удален.

Answer 1

Вы можете использовать eventAfterRender для добавления пользовательского идентификатора к элементу dom с использованием свойств данных. Затем возьмите идентификатор после drop (event.target), обновите событие в db, а затем обновите dataSource.

Fiddle

$(document).ready(function() { 

    $('#calendar').fullCalendar({ 
     ... 
     eventAfterRender: function(event, element){ 
      element.data('myId',event.myId); 
      $(element).droppable({ 
       drop: function(event, ui) { 
        var dragged = ui.draggable; 
        var targetId = $(event.target).data('myId'); 
       } 
      }); 
     } 
     ... 
    }); 
}); 

$(document).ready(function() { 
    $(".employeeItem").draggable(); 
});