Hi All,
Are there some people who have experience with full calendar? It displays the end time of my appointments in the calendar but i would like to see the start time of each appointment instead of the end time. Does anyone know where to do this? I've searched a while but cant find it unfortunately.
I also would like to edit the displayed time notation. It says 10:45 a or p but i would like it to display it as 22:45.
Thanks in advance!
Kind regards,
Faissal Berrhout
To display the start time instead of the end time and to change the time format in FullCalendar Reactive v6 (OutSystems O11), follow the steps below. This Forge component wraps the FullCalendar JavaScript library, so you will need to modify its configuration via JSON in the OptionsJSON property.
1. Show Start Time Instead of End Time
By default, FullCalendar shows the event title in the event block. If your event title includes the end time, it's likely generated from your data.
Solution:
Make sure the event title in your event source includes the start time, like this:
{
"title": "Meeting at 10:45",
"start": "2025-05-26T10:45:00",
"end": "2025-05-26T11:45:00"
}
Alternatively, use the eventTimeFormat setting to display start time directly in the event block.
2. Change Time Notation to 24-Hour Format
To change time display from 10:45 a/p to 22:45, set the eventTimeFormat and slotLabelFormat options in the OptionsJSON input like this:
"eventTimeFormat": {
"hour": "2-digit",
"minute": "2-digit",
"hour12": false
},
"slotLabelFormat": {
eventTimeFormat: Controls how the time appears inside events.
slotLabelFormat: Controls how the time appears on the time slots of the calendar.
You can inject this JSON into the OptionsJSON parameter of the FullCalendar block in OutSystems.
Example Combined Configuration
Here’s a complete example of a minimal OptionsJSON:
"initialView": "timeGridWeek",
Where to set this in OutSystems
Drag the FullCalendarReactive block onto your screen.
Set the OptionsJSON property with the JSON above.
Make sure your Events aggregate or list contains a title that includes the start time if desired.
Hi Bharathiraja,
Thank you very much for your reply! Where can i find these options? I dont see a server or client action with this included. And in the JS "Fullcalender_v6" i dont see the options you are referring too.