How to define custom time segments in the Scheduler time headers. In this example, we will display a special header that will highlight work weeks and weekends.
Jun 2, 2022
How to mark selected days as disabled and prevent adding, moving, and resizing events. You can use this technique to disable days in the past, weekends, holidays or other dates.
May 24, 2022
Use the Vue date picker component (Navigator) to change the current date. The date picker can highlight dates that already have events or are not available.
May 9, 2022
When removing events from the scheduler, it is possible to remove them completely or to move them to a queue of unscheduled tasks or a row with unassigned events (while keeping the scheduled time).
Apr 26, 2022
How to render custom React JSX component in the Scheduler grid cells.
Apr 4, 2022
The React Scheduler component allows customization of event content. This tutorial shows how to add a custom progress bar using event active areas.
Mar 4, 2022
How to change the zoom level of the JavaScript Scheduler component in real time using a slider and (+)/(-) buttons.
Jan 13, 2022
What things to look at when you are not happy with the React Scheduler component performance.
Dec 17, 2021
How to render custom JSX components in events displayed by the React Calendar component.
Dec 8, 2021
Learn how to search React Scheduler events, highlight the search text and jump between results using Next and Previous buttons.
Nov 27, 2021
How to limit the number of concurrent events displayed by the monthly calendar and add an "expand" button to access the events.
Nov 5, 2021
How to use the native HTML5 drag and drop API to extend the calendar functionality and allow dragging an all-day event to a selected calendar cell.
Oct 29, 2021
Plan activities for multiple areas/departments side by side. Use drag and drop to schedule events and milestones.
Oct 18, 2021
How to drag items either to the JavaScript Calendar component or to a custom element.
Sep 30, 2021
How to use the JavaScript Scheduler component in a new NPM/WebPack project.
Sep 10, 2021
How to enable on-demand event loading in the Vue Scheduler component. The Scheduler will load events for the current viewport. Additional data will be loaded during scrolling.
Aug 23, 2021
How to display a special column with summary data on the right side of the JavaScript Scheduler grid.
Aug 11, 2021
Vue application that shows how to integrate and configure a Gantt chart. The Gantt chart component displays a timeline for a hierarchy of tasks and milestones.
Aug 9, 2021
How to display React JSX components in the Scheduler horizontal time header.
Aug 3, 2021
How to use the column hierarchy feature of the React calendar to display events for many resources. The groups and resources are displayed as columns and the time slots are displayed as rows.
Jul 30, 2021