Split widget
- Last UpdatedOct 10, 2025
- 2 minute read
The Split widget allows you to split an event into two at a point in time. You can set the new event to precede or follow the original event using either the Left or Right control button and specify at which time point to apply the split.
On the widget's initial load during runtime, you see the following:
For image reference, see Split widget representation.
-
Date and time input box and slider controls
You can use these controls to specify the split time. You can either enter a date and time value or drag the slider control. Regardless of the control you use, the same data is shown.
When you change the split time in the input box and then click anywhere outside that control or click the Refresh button next to it, the new value is reflected both in the input box and the slider controls. The input box validates the entered value. If the value isn't within the selected time range or the minimum split increment, it shows an error.
Note: The date and time follow the operating system format or browser's local time. Events that cross a Daylight Savings Time (DST) boundary might require using the slider to set the split time point.
-
Event information
The widget shows the duration of an event at the far left and right side of the widget, and the mid-time point between the start and end date and time.
The position of the slider control on its initial load is configurable through a data property called initialSplitDateTime. For more information, see Data in Split widget properties usage.
-
Left and Right control buttons
You can use these buttons to set the left and right areas of the split bar on either side of the slider control to the appropriate event color or gray if the new event has not been assigned or selected yet.
Properties
The Split widget includes the following properties. For information on how the properties are used, see Split widget properties usage.
|
Property |
Supported datatype |
|---|---|
|
Widget Title (widgetTitle) |
String |
|
Data (data) |
Object |
|
New Event Color (newEventColor) |
Object |
|
Increment (increment) |
Numeric |
|
Split Data (splitData) |
Object |