Class sap.ui.unified.CalendarRowModule: sap/ui/unified/CalendarRow
A calendar row with an header and appointments. The Appointments will be placed in the defined interval.
Since: 1.34.0.
sClassName and enriches it with the information contained in oClassInfo.fnFunction to the intervalSelect event of this sap.ui.unified.CalendarRow.fnFunction to the leaveRow event of this sap.ui.unified.CalendarRow.fnFunction to the select event of this sap.ui.unified.CalendarRow.fnFunction to the startDateChange event of this sap.ui.unified.CalendarRow.fnFunction from the intervalSelect event of this sap.ui.unified.CalendarRow.fnFunction from the leaveRow event of this sap.ui.unified.CalendarRow.fnFunction from the select event of this sap.ui.unified.CalendarRow.fnFunction from the startDateChange event of this sap.ui.unified.CalendarRow.CalendarAppointment in the CalendarRow that is nearest to the given date.ariaLabelledBy.CalendarRow, some calculations for appointment sizes are needed.sap.ui.unified.CalendarAppointment in the aggregation appointments.sap.ui.unified.CalendarAppointment in the aggregation intervalHeaders.intervalHeaders.ariaLabelledBy.appointmentsReducedHeight.showEmptyIntervalHeaders.CalendarRow, the indicator for the current time must be positioned.CalendarRow. Accepts an object literal mSettings that defines initial property values, aggregated and associated objects as well as event handlers. See sap.ui.base.ManagedObject for a general description of the syntax of the settings object.
The supported settings are:
- Properties
- startDate : object
- intervals : int (default: 12)
- intervalType : sap.ui.unified.CalendarIntervalType (default: Hour)
- showSubIntervals : boolean (default: false)
- showIntervalHeaders : boolean (default: true)
- showEmptyIntervalHeaders : boolean (default: true)
- nonWorkingDays : int[]
- nonWorkingHours : int[]
- width : sap.ui.core.CSSSize
- height : sap.ui.core.CSSSize
- checkResize : boolean (default: true)
- updateCurrentTime : boolean (default: true)
- appointmentsReducedHeight : boolean (default: false)
- Aggregations
- appointments : sap.ui.unified.CalendarAppointment[]
- intervalHeaders : sap.ui.unified.CalendarAppointment[]
- Events
- select : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
- startDateChange : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
- leaveRow : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
- intervalSelect : fnListenerFunction or [fnListenerFunction, oListenerObject] or [oData, fnListenerFunction, oListenerObject]
In addition, all settings applicable to the base type sap.ui.core.Control can be used as well.
| {string} | sId? | ID for the new control, generated automatically if no ID is given |
| {object} | mSettings? | Initial settings for the new control |
| {sap.ui.base.Event} | oControlEvent | |
| {sap.ui.base.EventProvider} | oControlEvent.getSource | |
| {object} | oControlEvent.getParameters | |
| {object} | oControlEvent.getParameters.startDate | Interval start date as JavaScript date object |
| {object} | oControlEvent.getParameters.endDate | Interval end date as JavaScript date object |
| {boolean} | oControlEvent.getParameters.subInterval | If set, the selected interval is a subinterval |
- Since:
- 1.38.0
CalendarRow should be left while navigating. (Arrow up or arrow down.) The caller should determine the next control to be focused | {sap.ui.base.Event} | oControlEvent | |
| {sap.ui.base.EventProvider} | oControlEvent.getSource | |
| {object} | oControlEvent.getParameters | |
| {string} | oControlEvent.getParameters.type | The type of the event that triggers this leaveRow |
| {sap.ui.base.Event} | oControlEvent | |
| {sap.ui.base.EventProvider} | oControlEvent.getSource | |
| {object} | oControlEvent.getParameters | |
| {sap.ui.unified.CalendarAppointment} | oControlEvent.getParameters.appointment | selected appointment |
| {sap.ui.unified.CalendarAppointment[]} | oControlEvent.getParameters.appointments | selected appointments in case a group appointment is selected |
| {boolean} | oControlEvent.getParameters.multiSelect | If set, the appointment was selected by multiple selection (e.g. shift + mouse click). So more than the current appointment could be selected. |
startDate was changed while navigating in CalendarRow| {sap.ui.base.Event} | oControlEvent | |
| {sap.ui.base.EventProvider} | oControlEvent.getSource | |
| {object} | oControlEvent.getParameters |
sClassName and enriches it with the information contained in oClassInfo. oClassInfo might contain the same kind of information as described in sap.ui.core.Control.extend.
| {string} | sClassName | Name of the class being created |
| {object} | oClassInfo? | Object literal with information about the class |
| {function} | FNMetaImpl? | Constructor function for the metadata object; if not given, it defaults to sap.ui.core.ElementMetadata |
| {function} | Created class / constructor function |
| {sap.ui.base.Metadata} | Metadata object describing this class |
appointments. | {sap.ui.unified.CalendarAppointment} | oAppointment | the appointment to add; if empty, nothing is inserted |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
ariaLabelledBy. | {string|sap.ui.core.Control} | vAriaLabelledBy | the ariaLabelledBy to add; if empty, nothing is inserted |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervalHeaders. | {sap.ui.unified.CalendarAppointment} | oIntervalHeader | the intervalHeader to add; if empty, nothing is inserted |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction to the intervalSelect event of this sap.ui.unified.CalendarRow. When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.unified.CalendarRow itself.
Fired if an interval was selected
| {object} | oData? | An application-specific payload object that will be passed to the event handler along with the event object when firing the event |
| {function} | fnFunction | The function to be called when the event occurs |
| {object} | oListener? | Context object to call the event handler with. Defaults to this sap.ui.unified.CalendarRow itself |
- Since:
- 1.38.0
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction to the leaveRow event of this sap.ui.unified.CalendarRow. When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.unified.CalendarRow itself.
The CalendarRow should be left while navigating. (Arrow up or arrow down.) The caller should determine the next control to be focused
| {object} | oData? | An application-specific payload object that will be passed to the event handler along with the event object when firing the event |
| {function} | fnFunction | The function to be called when the event occurs |
| {object} | oListener? | Context object to call the event handler with. Defaults to this sap.ui.unified.CalendarRow itself |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction to the select event of this sap.ui.unified.CalendarRow. When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.unified.CalendarRow itself.
Fired if an appointment was selected
| {object} | oData? | An application-specific payload object that will be passed to the event handler along with the event object when firing the event |
| {function} | fnFunction | The function to be called when the event occurs |
| {object} | oListener? | Context object to call the event handler with. Defaults to this sap.ui.unified.CalendarRow itself |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction to the startDateChange event of this sap.ui.unified.CalendarRow. When called, the context of the event handler (its this) will be bound to oListener if specified, otherwise it will be bound to this sap.ui.unified.CalendarRow itself.
startDate was changed while navigating in CalendarRow
| {object} | oData? | An application-specific payload object that will be passed to the event handler along with the event object when firing the event |
| {function} | fnFunction | The function to be called when the event occurs |
| {object} | oListener? | Context object to call the event handler with. Defaults to this sap.ui.unified.CalendarRow itself |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
appointments. | {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervalHeaders. | {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction from the intervalSelect event of this sap.ui.unified.CalendarRow. The passed function and listener object must match the ones used for event registration.
| {function} | fnFunction | The function to be called, when the event occurs |
| {object} | oListener | Context object on which the given function had to be called |
- Since:
- 1.38.0
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction from the leaveRow event of this sap.ui.unified.CalendarRow. The passed function and listener object must match the ones used for event registration.
| {function} | fnFunction | The function to be called, when the event occurs |
| {object} | oListener | Context object on which the given function had to be called |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction from the select event of this sap.ui.unified.CalendarRow. The passed function and listener object must match the ones used for event registration.
| {function} | fnFunction | The function to be called, when the event occurs |
| {object} | oListener | Context object on which the given function had to be called |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
fnFunction from the startDateChange event of this sap.ui.unified.CalendarRow. The passed function and listener object must match the ones used for event registration.
| {function} | fnFunction | The function to be called, when the event occurs |
| {object} | oListener | Context object on which the given function had to be called |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervalSelect to attached listeners. Expects the following event parameters:
startDateof typeobjectInterval start date as JavaScript date objectendDateof typeobjectInterval end date as JavaScript date objectsubIntervalof typebooleanIf set, the selected interval is a subinterval
| {Map} | mArguments? | The arguments to pass along with the event |
- Since:
- 1.38.0
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
leaveRow to attached listeners. Expects the following event parameters:
typeof typestringThe type of the event that triggers thisleaveRow
| {Map} | mArguments? | The arguments to pass along with the event |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
select to attached listeners. Expects the following event parameters:
appointmentof typesap.ui.unified.CalendarAppointmentselected appointmentappointmentsof typesap.ui.unified.CalendarAppointment[]selected appointments in case a group appointment is selectedmultiSelectof typebooleanIf set, the appointment was selected by multiple selection (e.g. shift + mouse click). So more than the current appointment could be selected.
| {Map} | mArguments? | The arguments to pass along with the event |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
startDateChange to attached listeners. | {Map} | mArguments? | The arguments to pass along with the event |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
CalendarAppointment in the CalendarRow. | {CalendarAppointment} | oAppointment | Appointment to be focused. |
| {sap.ui.unified.CalendarRow} | this to allow method chaining |
CalendarAppointment in the CalendarRow that is nearest to the given date. | {object} | oDate | Javascript Date object. |
| {sap.ui.unified.CalendarRow} | this to allow method chaining |
appointments. Appointments to be displayed in the row. Appointments outside the visible time frame are not rendered.
Note: For performance reasons, only appointments in the visible time range or nearby should be assigned.
| {sap.ui.unified.CalendarAppointment[]} |
appointmentsReducedHeight. If set the appointments without text (only title) are rendered with a smaller height.
Note: On phone devices this property is ignored, appointments are always rendered in full height to allow touching.
Default value is false.
- Since:
- 1.38.0
| {boolean} | Value of property appointmentsReducedHeight |
ariaLabelledBy. | {sap.ui.core.Control[]} |
checkResize. If set, the CalendarRow checks for resize by itself.
If a lot of CalendarRow controls are used in one container control (like PlanningCalendar). the resize checks should be done only by this container control. Then the container control should call handleResize of the CalendarRow if a resize happens.
Default value is true.
| {boolean} | Value of property checkResize |
CalendarAppointment of the CalendarRow. The focus must not really be on the CalendarAppointment, it have just to be the one that has the focus when the CalendarRow was focused last time.
| {sap.ui.unified.CalendarAppointment} | Focused Appointment |
height. Height of the row
| {sap.ui.core.CSSSize} | Value of property height |
intervalHeaders. Appointments to be displayed in the top of the intervals. The intervalHeaders are used to visualize public holidays and similar things.
Appointments outside the visible time frame are not rendered.
The intervalHeaders always fill whole intervals. If they are shorter than one interval, they are not displayed.
Note: For performance reasons, only appointments in the visible time range or nearby should be assigned.
| {sap.ui.unified.CalendarAppointment[]} |
intervals. Number of displayed intervals. The size of the intervals is defined with intervalType
Default value is 12.
| {int} | Value of property intervals |
intervalType. Type of the intervals of the row. The default is one hour.
Default value is Hour.
| {sap.ui.unified.CalendarIntervalType} | Value of property intervalType |
nonWorkingDays. If set, the provided weekdays are displayed as non-working days. Valid values inside the array are 0 to 6. (Other values will just be ignored.)
If not set, the weekend defined in the locale settings is displayed as non-working days.
Note: The non working days are only visualized if intervalType is set to day.
| {int[]} | Value of property nonWorkingDays |
nonWorkingHours. If set, the provided hours are displayed as non-working hours. Valid values inside the array are 0 to 23. (Other values will just be ignored.)
Note: The non working hours are only visualized if intervalType is set to hour.
| {int[]} | Value of property nonWorkingHours |
showEmptyIntervalHeaders. If set, interval headers are shown even if no intervalHeaders are assigned to the visible time frame.
If not set, no interval headers are shown if no intervalHeaders are assigned.
Note: This property is only used if showIntervalHeaders is set to true.
Default value is true.
- Since:
- 1.38.0
| {boolean} | Value of property showEmptyIntervalHeaders |
showIntervalHeaders. If set, interval headers are shown like specified in showEmptyIntervalHeaders.
If not set, no interval headers are shown even if intervalHeaders are assigned.
Default value is true.
| {boolean} | Value of property showIntervalHeaders |
showSubIntervals. If set, subintervals are shown.
If the interval type is Hour, quarter hours are shown.
If the interval type is Day, hours are shown.
If the interval type is Month, days are shown.
Default value is false.
| {boolean} | Value of property showSubIntervals |
startDate. Start date, as JavaScript Date object, of the row. As default, the current date is used.
| {object} | Value of property startDate |
updateCurrentTime. If set the CalendarRow triggers a periodic update to visualize the current time.
If a lot of CalendarRow controls are used in one container control (like PlanningCalendar) the periodic update should be triggered only by this container control. Then the container control should call updateCurrentTimeVisualization of the CalendarRow to update the visualization.
Default value is true.
| {boolean} | Value of property updateCurrentTime |
width. Width of the row
| {sap.ui.core.CSSSize} | Value of property width |
CalendarRow, some calculations for appointment sizes are needed. For this, each CalendarRow can trigger the resize check for it's own DOM. But if multiple CalendarRows are used in one container (e.g. PlanningCalendar), it is better if the container triggers the resize check once an then calls this function of each CalendarRow.
| {jQuery.Event} | oEvent | The event object of the resize handler. |
| {sap.ui.unified.CalendarRow} | this to allow method chaining |
sap.ui.unified.CalendarAppointment in the aggregation appointments. and returns its index if found or -1 otherwise. | {sap.ui.unified.CalendarAppointment} | oAppointment | The appointment whose index is looked for |
| {int} | The index of the provided control in the aggregation if found, or -1 otherwise |
sap.ui.unified.CalendarAppointment in the aggregation intervalHeaders. and returns its index if found or -1 otherwise. | {sap.ui.unified.CalendarAppointment} | oIntervalHeader | The intervalHeader whose index is looked for |
| {int} | The index of the provided control in the aggregation if found, or -1 otherwise |
appointments. | {sap.ui.unified.CalendarAppointment} | oAppointment | the appointment to insert; if empty, nothing is inserted |
| {int} | iIndex | the 0-based index the appointment should be inserted at; for a negative value of iIndex, the appointment is inserted at position 0; for a value greater than the current size of the aggregation, the appointment is inserted at the last position |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervalHeaders. | {sap.ui.unified.CalendarAppointment} | oIntervalHeader | the intervalHeader to insert; if empty, nothing is inserted |
| {int} | iIndex | the 0-based index the intervalHeader should be inserted at; for a negative value of iIndex, the intervalHeader is inserted at position 0; for a value greater than the current size of the aggregation, the intervalHeader is inserted at the last position |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
appointments. Additionally, it unregisters them from the hosting UIArea.
| {sap.ui.unified.CalendarAppointment[]} | An array of the removed elements (might be empty) |
ariaLabelledBy. | {sap.ui.core.Control[]} | An array of the removed elements (might be empty) |
intervalHeaders. Additionally, it unregisters them from the hosting UIArea.
| {sap.ui.unified.CalendarAppointment[]} | An array of the removed elements (might be empty) |
appointments. | {int|string|sap.ui.unified.CalendarAppointment} | vAppointment | The appointmentto remove or its index or id |
| {sap.ui.unified.CalendarAppointment} | The removed appointment or null |
ariaLabelledBy. | {int|string|sap.ui.core.Control} | vAriaLabelledBy | The ariaLabelledByto be removed or its index or ID |
| {sap.ui.core.Control} | the removed ariaLabelledBy or null |
intervalHeaders. | {int|string|sap.ui.unified.CalendarAppointment} | vIntervalHeader | The intervalHeaderto remove or its index or id |
| {sap.ui.unified.CalendarAppointment} | The removed intervalHeader or null |
appointmentsReducedHeight. If set the appointments without text (only title) are rendered with a smaller height.
Note: On phone devices this property is ignored, appointments are always rendered in full height to allow touching.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is false.
| {boolean} | bAppointmentsReducedHeight | New value for property appointmentsReducedHeight |
- Since:
- 1.38.0
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
checkResize. If set, the CalendarRow checks for resize by itself.
If a lot of CalendarRow controls are used in one container control (like PlanningCalendar). the resize checks should be done only by this container control. Then the container control should call handleResize of the CalendarRow if a resize happens.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is true.
| {boolean} | bCheckResize | New value for property checkResize |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
height. Height of the row
When called with a value of null or undefined, the default value of the property will be restored.
| {sap.ui.core.CSSSize} | sHeight | New value for property height |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervals. Number of displayed intervals. The size of the intervals is defined with intervalType
When called with a value of null or undefined, the default value of the property will be restored.
Default value is 12.
| {int} | iIntervals | New value for property intervals |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
intervalType. Type of the intervals of the row. The default is one hour.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is Hour.
| {sap.ui.unified.CalendarIntervalType} | sIntervalType | New value for property intervalType |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
nonWorkingDays. If set, the provided weekdays are displayed as non-working days. Valid values inside the array are 0 to 6. (Other values will just be ignored.)
If not set, the weekend defined in the locale settings is displayed as non-working days.
Note: The non working days are only visualized if intervalType is set to day.
When called with a value of null or undefined, the default value of the property will be restored.
| {int[]} | sNonWorkingDays | New value for property nonWorkingDays |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
nonWorkingHours. If set, the provided hours are displayed as non-working hours. Valid values inside the array are 0 to 23. (Other values will just be ignored.)
Note: The non working hours are only visualized if intervalType is set to hour.
When called with a value of null or undefined, the default value of the property will be restored.
| {int[]} | sNonWorkingHours | New value for property nonWorkingHours |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
showEmptyIntervalHeaders. If set, interval headers are shown even if no intervalHeaders are assigned to the visible time frame.
If not set, no interval headers are shown if no intervalHeaders are assigned.
Note: This property is only used if showIntervalHeaders is set to true.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is true.
| {boolean} | bShowEmptyIntervalHeaders | New value for property showEmptyIntervalHeaders |
- Since:
- 1.38.0
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
showIntervalHeaders. If set, interval headers are shown like specified in showEmptyIntervalHeaders.
If not set, no interval headers are shown even if intervalHeaders are assigned.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is true.
| {boolean} | bShowIntervalHeaders | New value for property showIntervalHeaders |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
showSubIntervals. If set, subintervals are shown.
If the interval type is Hour, quarter hours are shown.
If the interval type is Day, hours are shown.
If the interval type is Month, days are shown.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is false.
| {boolean} | bShowSubIntervals | New value for property showSubIntervals |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
startDate. Start date, as JavaScript Date object, of the row. As default, the current date is used.
When called with a value of null or undefined, the default value of the property will be restored.
| {object} | oStartDate | New value for property startDate |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
updateCurrentTime. If set the CalendarRow triggers a periodic update to visualize the current time.
If a lot of CalendarRow controls are used in one container control (like PlanningCalendar) the periodic update should be triggered only by this container control. Then the container control should call updateCurrentTimeVisualization of the CalendarRow to update the visualization.
When called with a value of null or undefined, the default value of the property will be restored.
Default value is true.
| {boolean} | bUpdateCurrentTime | New value for property updateCurrentTime |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
width. Width of the row
When called with a value of null or undefined, the default value of the property will be restored.
| {sap.ui.core.CSSSize} | sWidth | New value for property width |
| {sap.ui.unified.CalendarRow} | Reference to this in order to allow method chaining |
CalendarRow, the indicator for the current time must be positioned. For this, each CalendarRow can trigger a timer. But if multiple CalendarRows are used in one container (e.G. PlanningCalendar), it is better if the container triggers the interval once an then calls this function of each CalendarRow.
| {sap.ui.unified.CalendarRow} | this to allow method chaining |