select multiple events at once over multiple rows using drag and drop (this is the default action)
select multiple events in a row using drag and drop
create a time range selection over multiple rows
How to Trigger the Rectangle Selection
The rectangle selection is disabled by default. You can enable it using the rectangleSelectHandling property.
Once you enable the rectangle selection, it can be activated using Shift+drag.
Using the onGridMouseDown event handler, you can change the mapping and use a simple drag, a custom modifier key, or the right mouse button.
Rectangle Selection Mode
By default, the rectangle allows a free-hand selection over multiple rows.
You can also limit it to a single row using the rectangleSelectMode property:
The Default Action
Another options is to set the value to
"Enabled". In that case, the Scheduler will not perform any action and you can provide your own implementation using the onRectangleSelecting, onRectangleSelect and onRectangleSelected events.
Overriding the Behavior
You can disable the default behavior and implement a custom action using the onRectangleSelecting event handler. This event is fired in real time and you can use it to provide live information about the underlying events or cells.
As soon as the user releases the mouse button, the Scheduler fires onRectangleSelect and onRectangleSelected events. There, you have access to the rectangle selection details (overlapping events, resources, time range) and you can perform custom operations.
Selecting a Time Range over Multiple Rows
The following tutorial shows how to implement time range selection that spans multiple rows: