I have the following AJAX code snippet for the calendar:
$.ajax({
url: 'display_event.php',
dataType: 'json',
success: function (response) {
var result=response.data;
$.each(result, function (i, item) {
events.push({
event_id: result[i].event_id,
title: result[i].title,
start: result[i].start,
end: result[i].end,
//color: result[i].color,
url: result[i].url
});
})
var calendar = $('#calendar').fullCalendar({
defaultView: 'month',
timeZone: 'local',
editable: true,
selectable: true,
selectHelper: false,
select: function(start, end) {
//alert(start);
//alert(end);
$('#event_start_date').val(moment(start).format('YYYY-MM-DD'));
$('#event_end_date').val(moment(end).format('YYYY-MM-DD'));
$('#event_entry_modal').modal('show');
},
events: events,
eventRender: function(event, element, view) {
element.find('.fc-title').append(" <b>" + event.end +"</b>");
element.bind('click', function() {
alert(event.end);
});
}
}); //end fullCalendar block
},//end success block
error: function (xhr, status) {
alert(response.msg);
}
});
In my code, I have concatenated "event.end" with the event title but it is currently displayed in milliseconds. Ideally, I want it to be shown as YYYY-MM-DD based on the database and JSON data provided. The JSON data appears to be correctly passing YYYY-MM-DD format (e.g. 2023-08-13).
The current output looks like this screenshot below. My goal is to display the event as "GovernmentHoliday 2023-08-13".
The alert functionality, however, seems to be working fine.
element.bind('click', function() {
alert(event.end);
});