Is there a way to automatically refresh a div that includes a FullCalendar Calendar?
I'm looking to refresh the div every 30 seconds to check for new data from the database without having to modify the ViewModel or reloading the page.
index.html
<div id='calendar' style="background-color: #fff;"></div>
@section scripts{
<script>
document.addEventListener('DOMContentLoaded', function () {
var calendarEl = document.getElementById('calendar');
let calendar = new FullCalendar.Calendar(calendarEl, {
plugins: ['resourceTimeGrid'],
defaultView: 'resourceTimeGridDay',
schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
businessHours: true,
nowIndicator: true,
minTime: "07:00:00",
maxTime: "19:00:00",
header: false,
height: "parent",
eventTextColor: '#fff',
eventColor: '#005d99',
resources: @Html.Raw(Json.Serialize(Model.Resources)),
events: @Html.Raw(Json.Serialize(Model.Events))
});
calendar.render();
});
</script>
}