只要事件未更改，即使全天为假，完整日历结束日期为空

Question

>有人知道为什么那些"全天=假"事件的结束日期为空吗？

小提琴样本：https://jsfiddle.net/L1g0z3jd/

我实例化它的方式与开始日期不同，它在日历视图中显示得很好，但由于某种原因，每当我得到clientEvents时我都无法理解，即使认为我没有更改它，我在事件结束日期中得到了一个空值！

PS：只是为了"良心"，我必须补充...我正在使用旧版本的谷歌浏览器(v 57.0.2987.133 64 位(和旧的 ubuntu 版本(Linux Mint 18.1 Serena(

这让我发疯了！谢谢！

网页代码：

<button onclick="javascript:getEvents()">Get Events</button>
<div id='calendar'></div>

Javascript 代码：

$(function() {
$('#calendar').fullCalendar({
header: false,
allDaySlot: false,
visibleRange: {start: moment('2000-01-02'), end: moment('2000-01-09')},
editable: true,
selectable: true,
views: {
settimana: {
type: 'agenda',
columnFormat: 'ddd',
hiddenDays: []
}
},
defaultView: 'settimana',
defaultDate: $.fullCalendar.moment().startOf('week'),
slotMinutes: 30,
events: [
$.fn.getAgendaWorktime(1, "08:00:00", 60),
$.fn.getAgendaWorktime(2, "08:30:00", 120),
],
select: function(startDate, endDate) {
$('#calendar').fullCalendar('renderEvent', {
title: 'free time',
start: startDate.format(),
end: endDate.format(),
allDay: false
});
},
eventClick: function(calEvent, jsEvent, view) {
console.log(calEvent, jsEvent, view);
if(doubleClick==calEvent._id){
if (confirm('Delete it?')) {
$('#calendar').fullCalendar('removeEvents',calEvent._id);
}
doubleClick = null;
}else{
doubleClick=calEvent._id;
}
},
});
});
function getEvents() {
var e=0,err=false,$data = []
$('#calendar').fullCalendar('clientEvents').forEach(periodo => {
if (periodo.end==null || periodo.start.format().substr(0,10)!=periodo.end.format().substr(0,10)) {
if (e==0) {
err = true;
e++;
alert('Event startint at '+periodo.start.format()+' cant spread to multiple days');
}
} else {
$data.push({'ini': periodo.start.format(), 'fim': periodo.end.format()});
}
});
alert($data);
}
jQuery.fn.getAgendaWorktime = function ($dow, $start, $elapsed) {
var r = {
allDay: false,
title: 'free time',
start: new Date('2000-01-02 '+$start),
end: new Date('2000-01-02 '+$start)
};
r.start.setDate(r.start.getDate()+$dow);
r.end.setDate(r.end.getDate()+$dow);
r.end.setHours(r.end.setHours()+($elapsed*60));
return(r);
}

Answer 1

我想出了如何解决这个问题的方法，我会在这里回复它，因为我在互联网上没有找到任何解决方法或对问题的进一步分析....

我没有审查我的问题以确定它是否与我错误地设置了事件的结束时间并且日历没有给我任何关于该问题或其他任何错误的事实有关，但如果你在我走的同一条路上徘徊，我可以告诉你：

1. 检查结束时间是否被正确创建(接缝是我真正的错误，我在getAgendaWorktime函数中使用setHours而不是getHours，它将最终值变为null。我在下面的示例中更正了它，但在小提琴中错误地显示 forceEventDuration 属性的使用(;
2. 将"forceEventDuration"参数设置为"true"(这迫使"end"属性始终填充，这使我在代码中变得轻松，因为我可以随时等待来自属性的".format(("方法的字符串(;

出于细微的原因 fullcalendar.io 有时不会设置事件结束日期，每当评估事件结束时间时，这都会给我带来问题(好吧，我可以解决它，但我很感兴趣为什么它会得到我这些结果当它没有，并且 answare 是一个错误的代码(。使用"forceEventDuration： true"，全日历每次都给了我结束时间，因此我可以发现我使用的输入法设置了错误的结束日期，并让我有机会纠正它。

相关链接：

• 日历参数文档 https://fullcalendar.io/docs/forceEventDuration
• 更正了小提琴 https://jsfiddle.net/gjrfox05/

我希望这个答案能对像我这样 fullcalendar.io 的新人有所帮助。

小提琴Javascript部分更正示例：

$(function() {
$('#calendar').fullCalendar({
header: false,
allDaySlot: false,
forceEventDuration: true,
visibleRange: {start: moment('2000-01-02'), end: moment('2000-01-09')},
editable: true,
selectable: true,
views: {
settimana: {
type: 'agenda',
columnFormat: 'ddd',
hiddenDays: []
}
},
defaultView: 'settimana',
defaultDate: $.fullCalendar.moment().startOf('week'),
slotMinutes: 30,
events: [
$.fn.getAgendaWorktime(1, "08:00:00", 60),
$.fn.getAgendaWorktime(2, "08:30:00", 120),
],
select: function(startDate, endDate) {
$('#calendar').fullCalendar('renderEvent', {
title: 'free time',
start: startDate.format(),
end: endDate.format(),
allDay: false
});
},
eventClick: function(calEvent, jsEvent, view) {
console.log(calEvent, jsEvent, view);
if(doubleClick==calEvent._id){
if (confirm('Delete it?')) {
$('#calendar').fullCalendar('removeEvents',calEvent._id);
}
doubleClick = null;
}else{
doubleClick=calEvent._id;
}
},
});
});
function getEvents() {
var e=0,err=false,$data = []
$('#calendar').fullCalendar('clientEvents').forEach(periodo => {
if (periodo.end==null || periodo.start.format().substr(0,10)!=periodo.end.format().substr(0,10)) {
if (e==0) {
err = true;
e++;
alert('Event startint at '+periodo.start.format()+' cant spread to multiple days');
}
} else {
$data.push({'ini': periodo.start.format(), 'fim': periodo.end.format()});
}
});
alert($data[0].fim);
}
jQuery.fn.getAgendaWorktime = function ($dow, $start, $elapsed) {
var r = {
allDay: false,
title: 'free time',
start: new Date('2000-01-02 '+$start),
end: new Date('2000-01-02 '+$start)
};
r.start.setDate(r.start.getDate()+$dow);
r.end.setDate(r.end.getDate()+$dow);
r.end.setHours(r.end.getHours()+($elapsed*60));
return(r);
}

Answer 2

默认情况下，当事件 end_date = start_date 时，FullCalendar 结束日期为 null。

我只是从数据库(Django View(传递另一个具有相同日期的恶魔。

event_sub_arr['end'] = end_date
event_sub_arr['end_same_date'] = end_date

并签入 javaScript

eventClick: function(info) {
var modal = document.getElementById('DeleteEventModal')
getEventDeleteUrl(info.event.id)
getEventUpdateUrl(info.event.id)
modal.style.display = 'block'
calendar.unselect()
var start = info.event.start
var end_same_date = info.event.end_same_date
var end = info.event.end || end_same_date

$("#event_id_name").text(info.event.title)
$("#event_id_start").text(moment(start).format('h:mm:ss a, MMMM Do YYYY'))
$("#event_id_end").text(moment(end).format('h:mm:ss a, MMMM Do YYYY'))
console.log(info.event.start)
console.log(info.event.end)
console.log({{ event_data|safe }})
},

它对我的工作