全日历拖放不同的背景事件
Fullcalendar drag / drop on different background event
我正在使用全日历,我可以调整和替换同一背景事件的事件,但我想 drag/drop 事件到其他背景事件。
这目前不起作用,因为我的光标上有一个停止标志。
如果有人帮助实现这一目标,那将非常可观。提前谢谢你。
editable: true,
eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) {
var id = event.id;
var start = event.start;
var end = event.end;
$.ajax({
url: 'update.php',
data:
{ updatetype: "resetdate",
token: "ahdghdghdghdghdghdghdghdgh",
start: (new Date(start).getTime() / 1000).toFixed(0),
end: (new Date(end).getTime() / 1000).toFixed(0),
event_id: id
},
type: 'POST'
});
}
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultDate: '2015-02-12',
businessHours: true, // display business hours
editable: true,
events: [
{
title: 'Business Lunch',
start: '2015-02-03T13:00:00',
constraint: 'businessHours' //define constraint id here
},
{
title: 'Meeting',
start: '2015-02-13T11:00:00',
constraint: 'availableForMeeting', // defined below
color: '#257e4a'
},
{
title: 'Conference',
start: '2015-02-18',
end: '2015-02-20'
},
{
title: 'Party',
start: '2015-02-29T20:00:00'
},
// areas where (your defined) "Meeting" must be dropped adjust as per your requirement
{
id: 'availableForMeeting',
start: '2015-02-11T10:00:00',
end: '2015-02-11T16:00:00',
rendering: 'background'
},
{
id: 'availableForMeeting',
start: '2015-02-13T10:00:00',
end: '2015-02-13T16:00:00',
rendering: 'background'
},
// red areas where no events can be dropped
{
start: '2015-02-24',
end: '2015-02-28',
overlap: true, //make true so you can drag and drop event on background as well
rendering: 'background',
color: '#ff9f89'
},
{
start: '2015-02-06',
end: '2015-02-08',
overlap: true,
rendering: 'background',
color: '#ff9f89'
}
]
});
});
</script>
我正在使用全日历,我可以调整和替换同一背景事件的事件,但我想 drag/drop 事件到其他背景事件。
这目前不起作用,因为我的光标上有一个停止标志。 如果有人帮助实现这一目标,那将非常可观。提前谢谢你。
editable: true,
eventDrop: function(event, delta, revertFunc, jsEvent, ui, view) {
var id = event.id;
var start = event.start;
var end = event.end;
$.ajax({
url: 'update.php',
data:
{ updatetype: "resetdate",
token: "ahdghdghdghdghdghdghdghdgh",
start: (new Date(start).getTime() / 1000).toFixed(0),
end: (new Date(end).getTime() / 1000).toFixed(0),
event_id: id
},
type: 'POST'
});
}
<script>
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
},
defaultDate: '2015-02-12',
businessHours: true, // display business hours
editable: true,
events: [
{
title: 'Business Lunch',
start: '2015-02-03T13:00:00',
constraint: 'businessHours' //define constraint id here
},
{
title: 'Meeting',
start: '2015-02-13T11:00:00',
constraint: 'availableForMeeting', // defined below
color: '#257e4a'
},
{
title: 'Conference',
start: '2015-02-18',
end: '2015-02-20'
},
{
title: 'Party',
start: '2015-02-29T20:00:00'
},
// areas where (your defined) "Meeting" must be dropped adjust as per your requirement
{
id: 'availableForMeeting',
start: '2015-02-11T10:00:00',
end: '2015-02-11T16:00:00',
rendering: 'background'
},
{
id: 'availableForMeeting',
start: '2015-02-13T10:00:00',
end: '2015-02-13T16:00:00',
rendering: 'background'
},
// red areas where no events can be dropped
{
start: '2015-02-24',
end: '2015-02-28',
overlap: true, //make true so you can drag and drop event on background as well
rendering: 'background',
color: '#ff9f89'
},
{
start: '2015-02-06',
end: '2015-02-08',
overlap: true,
rendering: 'background',
color: '#ff9f89'
}
]
});
});
</script>