1
fullcalendar jqueryプラグインのイベントをゴミ箱イメージにドラッグアンドドロップしてイベントを削除したいと思いますが、私の仕事を得るために。 をゴミ箱画像は以下CSHTMLに定義されている:fullcalendar eventDragStopはイベントが元の位置に戻った後に起動します
<div class="well well-sm" id="deleteEventsDiv" style="text-align:center">
<label id="delete_events_lbl" style="display:block; text-align:center; font-size:medium; font-weight:bold">Delete Events</label>
<img src="~/Images/cal-trash.png">
<div class="note">
<strong>Note:</strong> Drag and drop events here to delete them
</div>
</div>
Iはゴミ箱にイベントをドラッグすることができ、それは、eventDragStop
イベントがトリガされ、次いで元の位置に戻ることができます。ごみ箱の上にないので、残りのコードは実行されません。私はそれがゴミ箱の上にあるときに元の位置に戻らないからイベントを取得するにはどうすればよい
$('#edit_calendar').fullCalendar({
header:
{
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
titleFormat: { month: 'MMMM' },
defaultView: 'month',
selectable: true,
selectHelper: true,
droppable: true,
drop: function (date, jsEvent, ui, resourceId) {
var memberName = $(this).data('event').title;
var memberID = $(this).attr('id').toString();
//Create Event - add to array
var newEvent = new Object();
newEvent = {
title: memberName,
id: memberID,
start: date.format(),
end: date.format(),
objectID: 0
};
eventsAdded.push(newEvent);
},
editable: true,
//The following constraints prevents the user from adding/updating/deleting events that are before the current date
//The end date is required. So, you can't add events over a year away from the current date
eventConstraint: {
start: moment().startOf('day'),
end: moment(moment().startOf('day'), 'MM-DD-YYY').add('days', 365)
},
selectConstraint: {
start: moment().startOf('day'),
end: moment(moment().startOf('day'), 'MM-DD-YYY').add('days', 365)
},
resizable: true,
dragRevertDuration: 0,
eventDragStop: function (event, jsEvent, ui, view) {
alert('event drag stopped...should be over trash can.');
// This condition makes it easier to test if the event is over the trash can using Jquery
if ($('div#deleteEventsDiv').is(':hover')) {
// Confirmation popup
$.SmartMessageBox({
title: "Delete Event?",
content: 'Are you sure you want to remove this event from the calender?',
buttons: '[No][Yes]'
}, function (ButtonPressed) {
if (ButtonPressed === "Yes") {
// You can change the URL and other details to your liking.
// On success a small box notification will fire
$.ajax({
url: '/events/' + event.id,
type: 'DELETE',
success: function (request) {
$.smallBox({
title: "Deleting Event",
content: "Event Deleted",
color: "#659265",
iconSmall: "fa fa-check fa-2x fadeInRight animated",
timeout: 4000
});
$('#edit_calendar').fullCalendar('removeEvents', event.id);
}
});
}
});
}
}
}); //end calendar initialization
:これは私のfullcalendarコードですか?