将图像拖放到全日历中的事件

Question

我真的希望得到一些帮助。我正在使用全日历为孩子们做一个日历。应该可以将 som 图像图标拖放到日历的事件中。它看起来像这样：http://boerne.migraeniker.dk/kalender_filer/default.html但是我怎样才能显示我放在事件中的图像。

应该删除图像的代码在这里：

    drop:function(start,end, allDay) {
    var originalEventObject = $(this).data('event');

    var copiedEventObject = $.extend({}, originalEventObject);

   if (copiedEventObject.title) {

   start = $.fullCalendar.formatDate(start, "yyyy-MM-dd HH:mm:ss");

  $.ajax({
  url: 'http://boerne.migraeniker.dk/kalender_filer/add_events.php',
  data: 'title='+copiedEventObject.title+'&start='+ start +'&end='+ end,
  type: "POST",
  success: function(json) {
  }
  });

  calendar.fullCalendar('renderEvent',
  {
 title: copiedEventObject.title,
 start: start,
 end: end,
 allDay: allDay
 },
 true // make the event "stick"
 );
 }
 calendar.fullCalendar('unselect');
 }, 

我真的希望这是有道理的，否则我可以发布更多的代码。

Answer 1

看看外部拖动演示您需要在 $（'#mycalendar'） 中声明droppable和drop

droppable: true, // this allows things to be dropped onto the calendar !!!
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.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();
                }
            }

JSFiddle