1
월, 주, 일 및 목록보기 옵션으로 FullCalendar를 설정하려고합니다. 여기에서 볼 수 있듯이 거의 모든 작업에서 잘 작동합니다.FullCalendar - 목록보기 다중 일 이벤트가 올바르게 그룹화되지 않음
내가하려고 해요
을 : 그것은 시작 및 종료 날짜 사이
그러나, ListView에에, 멀티 일간의 행사를의 첫 번째 이벤트는 다른 evento로 그룹화되지 공동을 사용하다 fullCalendar multi-day event start and end times (나는 대답 또는이 의견을 충분한 명성을 가지고, 그래서 나는이 새로운 하나 만드는거야)
events.push({
title: "Birmingham Comic Con",
start: new Date('2016-11-20T09:00'),
end: new Date('2016-11-22T19:00'),
id: 1,
isMultipleDay: true,
multipleDayEvents: [
{
start: new Date('2016-11-20T09:00'),
end: new Date('2016-11-20T19:00'),
allDay: false,
description: 'Day 1',
},
{
start: new Date('2016-11-21T09:00'),
end: new Date('2016-11-20T19:00'),
allDay: false,
description: 'Day 2'
},
{
start: new Date('2016-11-22T09:00'),
end: new Date('2016-11-22T19:00'),
allDay: false,
description: 'Day 3'
}
]
});
events.push({
title: "Birmingham Comic Con Outro",
start: new Date('2016-11-20T10:00'),
end: new Date('2016-11-20T19:00'),
id: 2
});
events.push({
title: "Birmingham Comic Con No meio",
start: new Date('2016-11-21T10:00'),
end: new Date('2016-11-21T19:00'),
id: 3
});이 전체입니다 : 그 아래 드 나는이 문제의 대답에서 얻을 코드 :
$(document).ready(function() {
moment.locale(idioma);
var today = moment(Date()).format("YYYY-MM-DD");
var status = '';
var vencimento = '';
var description = '';
var action = '';
var setColor = '';
$('#calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,listMonth'
},
defaultDate: today,
defaultView: 'month',
listDayFormat: 'dddd',
listDayAltFormat: 'LL',
locale: 'en',
editable: false,
eventLimit: true, // allow "more" link when too many events
events: function (start, end, timezone, callback) {
jQuery.ajax({
url: window.root + "Calendarios/GetEvents",
type: 'POST',
dataType: 'json',
data: {
start: start.format(),
end: end.format(),
agendado: $("#Agendado").is(":checked"),
realizado: $("#Realizado").is(":checked"),
atrasado: $("#Atrasado").is(":checked")
},
success: function (data) {
var events = [];
/*
if (data.Success) {
$.map(data.Treinamentos, function (t) {
if (t.Status == 2) {
setColor = "green";
} else {
if (t.Status == 1 && (moment() > moment(t.DataFinal)))
setColor = "red";
else
setColor = "";
}
t.Participantes.forEach(function (item) {
if (item.Status == 2) {
setColor = "green";
} else {
if (t.Status == 1 && (moment() > moment(t.DataFinal)))
setColor = "red";
else
setColor = "";
}
events.push({
id: item.Id,
title: item.Funcionario.Registration + " - " + item.Funcionario.Name,
start: moment(t.DataInicial).format("YYYY-MM-DDTHH:mm:ss"),
end: moment(t.DataFinal).format("YYYY-MM-DDTHH:mm:ss"),
color: setColor,
description: t.InfoCardNumber + " - " + t.Revision,
url: window.root + "Treinamentos/Index/" + t.Id
});
});
});
}
*/
events.push({
title: "Birmingham Comic Con",
start: new Date('2016-11-20T09:00'),
end: new Date('2016-11-22T19:00'),
id: 1,
isMultipleDay: true,
multipleDayEvents: [
{
start: new Date('2016-11-20T09:00'),
end: new Date('2016-11-20T19:00'),
allDay: false,
description: 'Day 1',
},
{
start: new Date('2016-11-21T09:00'),
end: new Date('2016-11-20T19:00'),
allDay: false,
description: 'Day 2'
},
{
start: new Date('2016-11-22T09:00'),
end: new Date('2016-11-22T19:00'),
allDay: false,
description: 'Day 3'
}
]
});
events.push({
title: "Birmingham Comic Con Outro",
start: new Date('2016-11-20T10:00'),
end: new Date('2016-11-20T19:00'),
id: 2
});
events.push({
title: "Birmingham Comic Con No meio",
start: new Date('2016-11-21T10:00'),
end: new Date('2016-11-21T19:00'),
id: 3
});
callback(events);
}
});
},
eventRender: function (event, element) {
element.popover({
title: event.title,
placement: "auto",
html: true,
trigger: "click",
animation: "true",
content: event.description,
container: "body"
});
},
eventMouseout: function (event, jsEvent, view) {
$(this).popover("hide");
},
eventMouseover: function (event, jsEvent, view) {
$(this).popover("show");
}
});
//Botão Mostrar Filtro
$("#BtShowFilter").html(ShowFilter);
$("#BtShowFilter").on("click", function() {
$("#Filter").slideToggle(function() {
var text = $("#Filter").css("display") === "none" ? ShowFilter : HideFilter;
$("#BtShowFilter").html(text);
});
});
//Botão Filtro
$("#BtFilter").on("click", function() {
$('#calendar').fullCalendar("refetchEvents");
});
});