FullCalendar
v7
v7
latest
v6
(opens in a new tab)
v5
(opens in a new tab)
v4
(opens in a new tab)
v3
(opens in a new tab)
v2
(opens in a new tab)
v1
(opens in a new tab)
Demos
Docs
Support
Getting Help
Debug Templates
Reporting Bugs
Requesting Features
Contributing
Pricing
20.7k
Demos
Docs
Support
Getting Help
Debug Templates
Reporting Bugs
Requesting Features
Contributing
Pricing
Search
⌘
K
Getting Started
React
Vue
Angular
Vanilla JS
Preact
Web Component
Salesforce LWC
Tools & Plugins
Agent Guide
Plugins
Premium
V7 Migration
Overall Display
Theme
Toolbar
Sizing
Virtual Rendering
Locale
Views
Month
TimeGrid
List
DayGrid
Multi-Month Stack
Multi-Month Grid
Timeline
Vertical Resource
Custom Views
View API
Date & Time
Date Model
Time Zone
Date & Time Display
Date Navigation
Date Nav Links
Week Numbers
Date Clicking & Selecting
Now Indicator
Business Hours
Events
Event Model
Event Sources
Event Display
Event Clicking & Hovering
Event Dragging & Resizing
Event Popover
Background Events
Resources
Resource Data
Resource Display
Accessibility
Accessibility
Touch Support
Printer-Friendly Rendering
Docs menu
All Docs
View API
Copy page
Edit page
Settings, methods and handlers for working with and switching the current view.
initialView
The initial view when the calendar loads.
View Object
A View object contains information about a calendar view, such as title and date range.
Calendar::view
Access the View Object for the current view.
Calendar::changeView
Immediately switches to a different view.
Render Hooks
view
viewClass - a ClassName Input for the root view element.
table
Customize the table-structured layout used across views.
highlight
Customize the highlight element that appears when the user is selecting a date range.
filler
Customize the filler elements that keep the calendar's layout aligned.
See Also
View-Specific Options
You can specify options that apply only to specific calendar views.