Full Calendar Script

Job ID: 35148490

Budget: $30 – $250 USD

Attempting to use Full Calendar 5.11 to display Multiple json feeds in calendar. Using this script as a template.

document.addEventListener('DOMContentLoaded', function() {
var calendarEl = document.getElementById('calendar');

var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
headerToolbar: {
left: 'prev,next today',
center: 'title',
right: 'dayGridMonth,timeGridWeek,timeGridDay'
},
eventSources: [

// your event source
{
url: 'https://gulfcoast.assp.org/wp-json/ee/v4.8.29/events',
format: 'json',
method: 'GET',
extraParams: {
custom_param1: 'something',
custom_param2: 'somethingelse'

},
failure: function() {
alert('there was an error while fetching events!');
}
},
{
url: 'https://kc.assp.org/wp-json/ee/v4.8.29/events',
format: 'json',
method: 'GET',
extraParams: {
custom_param1: 'something',
custom_param2: 'somethingelse'
},
failure: function() {
alert('there was an error while fetching events!');
}
}

// any other sources...

]
});
calendar.render();
});

Can see the json feed connects in the console.log, but cannot figure out what the extra parameters should be to display info in the calendar.

This script worked in Full Calendar 2.1.3 using a single ajax feed

events: function( start, end, timezone, callback ){
var objectdata = {
where: {
'Datetime.DTT_EVT_start': [
'>', start.format() + 'T00:00:00'
],
'Datetime.DTT_EVT_end': [
'<', end.format() + 'T00:00:00'
]
},
"include": 'Datetime.*'
};
$.ajax({
//url: 'https://kc.assp.org/wp-json/ee/v4.8.29/events',
url: 'https://gulfcoast.assp.org/wp-json/ee/v4.8.29/events',
dataType: 'json',
// crossDomain:true,
// mimeType:'json',
data: objectdata ,
success: function(doc) {
var events = [];
$(doc).each(function() {
//only add events to the calendar if they have a datetime (they all should)
if( this.datetimes[0] ){
events.push({
title: this.EVT_name,
url: this.link,
start: this.datetimes[0].DTT_EVT_start,// will be parsed
end: this.datetimes[0].DTT_EVT_end // will be parsed
});
}
});
callback(events);
},
error: function( xhr, status, error ) {
alert('error communicating with server ' + status );
}
});
},

Deliverables

Function and script to display multiple json feeds in single calendar using Full Calendar 5.11
Related categories: PHP JavaScript AJAX jQuery / Prototype