I am using the resourceAreaHeaderContent
callback to print some HTML to my resourceArea
, including an icon which is supposed to start a function (by onclick
) which does some operations on resource sorting, writes them to database and refetches them from the database in the end.
However, if this function is outside the document.addEventListener
, I get calendar.fullCalendar is not a function
and if the function is inside the document.addEventListener
it can't be found, saying Example is not defined
.
I think I am missing something about the scope here or the function call from resourceAreaHeaderContent
is not correct. I have a codepen at https://codepen.io/craftydlx/pen/RwaqbvL and here is the code:
function Test(){
console.log("entering test");
console.log(calendar.id); //prints "calendar"
//$('#calendar').fullCalendar('refetchResources'); //"calendar.fullCalendar is not a function"
//calendar.fullCalendar('refetchResources'); //"calendar.fullCalendar is not a function"
calendar.refetchResources(); //"calendar.refetchResources is not a function"
}
document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
resourceAreaHeaderContent: { html:
'<div class="d-flex flex-column align-items-start">' +
'<div class="p-2"><div class="resourceLabel align-middle">Ressource</div></div>' +
'<div class="p-2"></div>' +
'<div class="p-2"></div>' +
'<div class="p-2">' +
'<br><i class="material-icons sorter" onclick="Test()">[ Test() ]</i>' + '<br><br>' +
'<i class="material-icons sorter" onclick="Example()">[ Example() ]</i>' +
'</div>' +
'</div>'
},
headerToolbar: {
left: 'today',
center: 'title',
right: 'resourceTimelineDay,resourceTimelineWeek'
},
slotLabelFormat: [
{ month: 'long', year: 'numeric' }, // top level of text
{ week: 'W' },
{ weekday: 'short', day: '2-digit' } // lower level of text
],
initialView: 'resourceTimelineWeek',
resources: 'https://fullcalendar.io/demo-resources.json',
events: 'https://fullcalendar.io/demo-events.json?single-day&for-resource-timeline',
});
function Example(){ //"Example is not defined"
//$('#calendar').fullCalendar('refetchResources'); //calendar.fullCalendar is not a function
calendar.fullCalendar('refetchResources'); //calendar.fullCalendar is not a function
}
calendar.render();
});
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…