С помощью пользователя @ADyson я нашел решение моей проблемы (проблем). Вот несколько полный пример и ответ, если кто-то еще случайно наткнется на те же проблемы или захочет работать с событиями FullCalender, подав его JSON в контексте MVC.
Сначала у меня есть событие класс с необходимыми атрибутами (на самом деле я использую только атрибуты title, start и color, но и остальные могут потребоваться, поэтому я добавил их в соответствии с этим сообщением Jquery Full Calendar json event исходный синтаксис ):
public class CalendarEvent
{
public int id { get; set; }
public string title { get; set; }
public string allDay { get; set; }
public string start { get; set; }
public string end { get; set; }
public string color { get; set; }
}
Затем в моем контроллере есть действие GetCalendarEvents, подобное этому:
public JsonResult GetCalendarEvents(string id, DateTime? date)
{
//Database related code to get dates and their amount of free pallets (this is where I use the id and date parameters)
var idEvent = 1;
foreach (var v in days)
{
var title = "";
var color = "";
var freecap = (v.DayOfWeek == DayOfWeek.Friday ? 200 : 300) - model.Incomings.Where(x => x.ExpectedDate == v &&
x.ExpectedPallets.HasValue).Sum(x => x.ExpectedPallets);
if(freecap >= 150)
{
title = "150-300";
color = "green";
} else if(freecap < 150 && freecap >= 10)
{
title = "10-149";
color = "yellow";
} else
{
title = "<10";
color = "red";
}
events.Add(new CalendarEvent { id = idEvent, title = title, allDay = "", start = v.Date.ToString().Substring(0,10), end = v.Date.ToString().Substring(0, 10), color = color });
idEvent++;
}
}
return Json(events, JsonRequestBehavior.AllowGet);
}
logi c в действии в основном просто получает правильные данные из нашей базы данных и определение цвета и названия мероприятия (это определяется количеством свободных поддонов на нашем складе на заданную дату). Этот метод может делать все, что вам нужно, суть его в том, что он создает список событий и возвращает их как результат Json.
В моем представлении, где находятся скрипт и виджет FullCalendar Я связываю события с действием следующим образом (не забудьте изменить маршрут, контроллер, действие и строку идентификатора, чтобы они соответствовали вашим собственным):
events: '@Url.HttpRouteUrl("Default", new { controller = "Home", action = "GetCalendarEvents", id = "DOD" })'
Перед вашим заголовком может появиться строка «12a» по всем событиям. Это потому, что он указывает время начала события (которое я не установил). В любом случае вы можете добавить эти две строки в сценарий, если хотите избавиться от него:
timeFormat: 'H(:mm)', // uppercase H for 24-hour clock
displayEventTime: false
Мой полный сценарий FullCalendar выглядит так:
<script type="text/javascript">
var calendar = new FullCalendar.Calendar($("#calendar")[0], {
plugins: ['interaction', 'dayGrid'],
height: 'auto',
defaultView: 'dayGridMonth',
weekNumberCalculation: 'ISO',
weekNumbers: true,
events: '@Url.HttpRouteUrl("Default", new { controller = "Home", action = "GetCalendarEvents", id = "DOD" })',
timeFormat: 'H(:mm)', // uppercase H for 24-hour clock
displayEventTime: false,
dateClick: function (info) {
window.location.href = "Incoming?date=" + info.dateStr;
}
});
calendar.render();
calendar.select('@(Model.Date?.ToString("yyyy-MM-dd"))');
</script>
Возвращенный JSON результат должен выглядеть примерно так:
[{"id":1,"title":"150-300","allDay":"","start":"2019-07-19","end":"2019-07-19","color":"green"},{"id":2,"title":"150-300","allDay":"","start":"2019-08-22","end":"2019-08-22","color":"green"},{"id":3,"title":"150-300","allDay":"","start":"2019-08-30","end":"2019-08-30","color":"green"}]
Здесь важно отметить, как указал @ADyson, что формат даты должен быть yyyy-MM-dd (поэтому мой обновленный пост не работал). Если вам нужна дополнительная информация, обратитесь к документации FullCalendar, с которой также связан @ADyson: Анализ событий и События (в виде json фида)