Questions about the 5.x branch of FullCalendar. Always use the "fullCalendar" tag in conjunction with this tag.
Questions tagged [fullcalendar-5]
573 questions
2
votes
1 answer
businessHours select constraint on month view
I got a problem when using FullCalendar v5. I'm trying to have a month view that had some businessHours (from monday to friday). The problem is caused by hours, on the documentation it's specified that by default the hours is from 9am to 5pm.
The…
Alexis R
- 138
- 7
2
votes
0 answers
How can I design a calendar where one can switch between month and dates within a month using FullCalendar?
I want to be able to switch between a month and dates within a month in my application using the FullCalendar plugin. How can I achieve that? I am attaching the screenshot of the UI of how I want it to somewhat look like so that the user can switch…
Ian Bell
- 533
- 5
- 18
2
votes
1 answer
Full Calendar Vue JS Component - Adding Events
I'm using Full Calendar with Vue JS: https://fullcalendar.io/docs/vue
I can't seem to find a way to add events using the Full Calendar Vue JS component. The only way I see the examples doing it is by getting ahold of the calendar's API and creating…
karns
- 5,391
- 8
- 35
- 57
2
votes
1 answer
gotoDate() not working on FullCalendar in timeline view
I'm using the timeline view of FullCalendar v5 and @fullcalendar/react and I want my clanedar to automatically to scroll to today. When I call .gotoDate() it doesn't do anything.
Here is my calendar code:
const calendarRef = useRef();
const…
Dev01
- 13,292
- 19
- 70
- 124
2
votes
1 answer
FullCalendar 5 with Sticky Resources Under Top Menu with Bootstrap 4
I'd like to be able to use Bootstrap 4's sticky menu in conjunction with Full Calendar 5's sticky resource headers. When scrolling down, I'd like the bootstrap menu to remain at the very top, followed by the resource headings (i.e. "Room A", "Room…
JasonJensenDev
- 2,377
- 21
- 30
2
votes
1 answer
How to set fullcalendar view to start 1 week before the current date?
I'm using Vue version of fullcalendar.io (v5) Resource Timeline View with a custom view object passed via settings and I can't figure out how to set it up so that the calendar start 1 week before the current date. I've tried initialDate,…
ihor.eth
- 2,207
- 20
- 27
2
votes
2 answers
How to add events in javascript fullCalendar
I am trying this library for the first time
want to set events to my calendar, but instead of doing this:
var calendarEl = document.getElementById('calendar');
var calendar = new FullCalendar.Calendar(calendarEl, {
initialView: 'dayGridMonth',
…
Kroi
- 246
- 3
- 9
2
votes
1 answer
How to show all events without range limitation in fullcalendar?
I want to show all events without any limitation in fullcalendar v5.
Here's my code.
document.addEventListener('DOMContentLoaded', function() {
var calendarEventsEl = document.getElementById('calendar-events');
calendarEvents = new…
hotcakedev
- 2,194
- 1
- 25
- 47
2
votes
0 answers
Custom view for events
I am using fullcalendar to display events using list view. Fullcalendar uses a table to render the list of events. I am using custom properties in addiction to title, start and end period therefore the event table is not very readable on mobile…
Maurizio
- 61
- 4
2
votes
2 answers
Alternative option for eventAfterAllRender in FullCalendar v5.x
In FullCalendar v3, there has an option to catch after loading all events.
eventAfterAllRender
It seems removed in v4. As saying here:
https://fullcalendar.io/docs/v4/upgrading-from-v3
Here has a code snippet to prepare a demo calendar in…
Encrypted
- 628
- 1
- 10
- 22
2
votes
1 answer
FullCalendar : No header for timeGridWeek outside ValidRange
I'm using fullcalendar 5.5.0 with Angular 10.
Something kind of annoying appears during the migration (fullcalendar v4 -> v5), there is no longer a header for the date before the start of the validRange :
With the parameters :
initialView:…
Nathan
- 71
- 8
2
votes
1 answer
adding html content to fullcalender 5.x. event
I'd like to add a html-object to every event for fullcalendar. (In my case a bootstrap-pill, but any other html also fail.)
I'd already manage this in other projects for fullcalender 3.x. But in 5.x this chances completly.
First idea:
I put the html…
mkours
- 390
- 2
- 11
2
votes
1 answer
Angular 11 : How to refetch (when events are changed from backEnd) Events in Fullcalendar V5?
I am working on
"@fullcalendar/angular": "^5.5.0",
I am unable to rerender the events that are subscribed from an API call. I searched everywhere but, nothing is working ... Please help..
Here is the code :
calendar.component.html
Parth Developer
- 1,371
- 1
- 13
- 30
2
votes
1 answer
Fullcalendar visibleRange not working on resource-daygrid
I am using fullcalendar's resource-daygrid on an event, and I'm trying to add a range.
Let say the event starts on Jan 12, 2021 and ends on Jan 15, 2021. Then I would like to show only this range and not allow clicking previous or next…
The Amplifier
- 43
- 7
2
votes
1 answer
Fullcalendar v5 sticky header in combination with Bootstrap fixed top navigation
I am testing the latest version of fullcalendar 5.4.0. I am using the calendar inside bootstrap 4 web page, which has fixed navigation at the top.
The problem is, when I try to set stickyHeaderDates, which should fix the calendar header toolbar at…
gdolenc
- 301
- 1
- 2
- 17