The TimePicker is an extension of the Input control and allows time selection in any device or browser supported by UI5. It enables users to fill time related input fields. For the TimePicker UI, you can define text, icon or both. A time format must be specified, otherwise the default "HH:mm:ss a" will be used. The functionality is aligned with the sap.m.DatePicker control for consistent behavior.
Since: 1.32.
Event Summary
change(oControlEvent)Fires when the input operation has finished and the value has changed. Method Summary
sap.m.TimePicker.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.m.TimePicker with name sClassName
and enriches it with the information contained in oClassInfo
. fireChange(mArguments?)Fires change event to attached listeners. getTitle()Gets current value of property title
. init()Initializes the control. setDateValue(oDate)Sets the dateValue
JavaScript date object. _feedReplaceChar,
_isCharAllowed,
addRule,
destroyRules,
getMask,
getPlaceholderSymbol,
getRules,
indexOfRule,
insertRule,
removeAllRules,
removeRule,
setValue addAriaLabelledBy,
applyFocusInfo,
attachChange,
bindToInputEvent,
bindValue,
closeValueStateMessage,
detachChange,
getAriaLabelledBy,
getDomRefForValueStateMessage,
getEditable,
getEnabled,
getFocusInfo,
getName,
getPlaceholder,
getRequired,
getSelectedText,
getShowValueStateMessage,
getTextAlign,
getTextDirection,
getValue,
getValueState,
getValueStateText,
getWidth,
onChange,
onValueRevertedByEscape,
openValueStateMessage,
removeAllAriaLabelledBy,
removeAriaLabelledBy,
selectText,
setEditable,
setEnabled,
setName,
setPlaceholder,
setRequired,
setShowValueStateMessage,
setTextAlign,
setTextDirection,
setValueState,
setValueStateText,
setWidth,
unbindValue,
updateDomValue addStyleClass,
allowTextSelection,
attachBrowserEvent,
attachValidateFieldGroup,
checkFieldGroupIds,
clone,
detachBrowserEvent,
detachValidateFieldGroup,
fireValidateFieldGroup,
getBusy,
getBusyIndicatorDelay,
getControlsByFieldGroupId,
getFieldGroupIds,
getIdForLabel,
getRenderer,
getVisible,
hasStyleClass,
invalidate,
isBusy,
placeAt,
removeStyleClass,
rerender,
setBusy,
setBusyIndicatorDelay,
setFieldGroupIds,
setVisible,
toggleStyleClass,
triggerValidateFieldGroup $,
addCustomData,
addDependent,
addEventDelegate,
bindElement,
data,
destroy,
destroyCustomData,
destroyDependents,
destroyLayoutData,
destroyTooltip,
enhanceAccessibilityState,
findElements,
fireEvent,
focus,
getCustomData,
getDependents,
getDomRef,
getElementBinding,
getFocusDomRef,
getInterface,
getLayoutData,
getMetadata,
getTooltip,
getTooltip_AsString,
getTooltip_Text,
indexOfCustomData,
indexOfDependent,
insertCustomData,
insertDependent,
prop,
removeAllCustomData,
removeAllDependents,
removeCustomData,
removeDependent,
removeEventDelegate,
setLayoutData,
setTooltip,
toString,
unbindElement addAggregation,
addAssociation,
applySettings,
attachFormatError,
attachModelContextChange,
attachParseError,
attachValidationError,
attachValidationSuccess,
bindAggregation,
bindContext,
bindObject,
bindProperty,
destroyAggregation,
detachFormatError,
detachModelContextChange,
detachParseError,
detachValidationError,
detachValidationSuccess,
findAggregatedObjects,
fireFormatError,
fireModelContextChange,
fireParseError,
fireValidationError,
fireValidationSuccess,
getAggregation,
getAssociation,
getBinding,
getBindingContext,
getBindingInfo,
getBindingPath,
getEventingParent,
getId,
getModel,
getObjectBinding,
getOriginInfo,
getParent,
getProperty,
hasModel,
indexOfAggregation,
insertAggregation,
isBound,
isInvalidateSuppressed,
isTreeBinding,
removeAggregation,
removeAllAggregation,
removeAllAssociation,
removeAssociation,
setAggregation,
setAssociation,
setBindingContext,
setModel,
unbindAggregation,
unbindContext,
unbindObject,
unbindProperty,
validateAggregation,
validateProperty Constructor Detail
new sap.m.TimePicker(sId?, mSettings?)
Constructor for a new TimePicker.
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:
In addition, all settings applicable to the base type sap.m.MaskInput can be used as well.
Parameters:
{string} | sId? | ID for the new control, generated automatically if no ID is given |
{object} | mSettings? | Initial settings for the new control |
Event Detail
change(oControlEvent)
Fires when the input operation has finished and the value has changed.
Parameters:
{sap.ui.base.Event} | oControlEvent | |
{sap.ui.base.EventProvider} | oControlEvent.getSource | |
{object} | oControlEvent.getParameters | |
{string} | oControlEvent.getParameters.value | The new value of the input |
{boolean} | oControlEvent.getParameters.valid | Indicator for a valid time |
Method Detail
sap.m.TimePicker.extend(sClassName, oClassInfo?, FNMetaImpl?): function
Creates a new subclass of class sap.m.TimePicker with name
sClassName
and enriches it with the information contained in
oClassInfo
.
oClassInfo
might contain the same kind of information as described in sap.m.MaskInput.extend.
Parameters:
{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 |
Returns:
{function} | Created class / constructor function |
Returns a metadata object for class sap.m.TimePicker.
Returns:
Fires change event to attached listeners.
Expects following event parameters:
- value parameter of type
string
- the new value of the input - valid parameter of type
boolean
- indicator for a valid time
Parameters:
{Map} | mArguments? | The arguments to pass along with the event |
Returns:
fireChangeEvent(sValue, oParams?)
Fires the change event for the listeners
Parameters:
{String} | sValue | value of the input. |
{Object} | oParams? | extra event parameters. |
getAccessibilityInfo()
See:
{sap.ui.core.Control#getAccessibilityInfo} |
getDateValue(): object
Gets current value of property
dateValue
.
Holds a reference to a JavaScript Date Object. The value
(string) property will be set according to it. Alternatively, if the value
and valueFormat
pair properties are supplied instead, the dateValue
will be instantiated аccording to the parsed value
.
Returns:
{object} | Value of property dateValue |
getDisplayFormat(): string
Gets current value of property
displayFormat
.
Determines the format, displayed in the input field and the picker sliders.
The default value is the browser's medium time format locale setting sap.ui.core.LocaleData#getTimePattern. If data binding with type sap.ui.model.type.Time is used for the value
property, the displayFormat
property is ignored as the information is provided from the binding itself.
Returns:
{string} | Value of property displayFormat |
getLocaleId(): string
Gets current value of property
localeId
.
Defines the locale used to parse string values representing time.
Determines the locale, used to interpret the string, supplied by the value
property. Example: AM in the string "09:04 AM" is locale (language) dependent. The format comes from the browser language settings if not set explicitly. Used in combination with 12 hour valueFormat
containing 'a', which stands for day period string. Default value is taken from browser's locale setting.
Returns:
{string} | Value of property localeId |
getTitle(): string
Gets current value of property
title
.
Displays the text of the general picker label and is read by screen readers. It is visible only on phone.
Returns:
{string} | Value of property title |
getValueFormat(): string
Gets current value of property
valueFormat
.
Determines the format of the value property.
The default value is the browser's medium time format locale setting sap.ui.core.LocaleData#getTimePattern. If data binding with type sap.ui.model.type.Time is used for the value
property, the valueFormat
property is ignored as the information is provided from the binding itself.
Returns:
{string} | Value of property valueFormat |
init()
Initializes the control.
onAfterClose()
Called after the picker closes.
onAfterOpen()
Called after the picker appears.
onBeforeOpen()
Called before the picker appears.
Sets the
dateValue
JavaScript date object.
Recommended usage is when value
is not set, as they are mutually exclusive.
Parameters:
{date} | oDate | New date object |
Returns:
Sets the displayFormat
.
Parameters:
{string} | sDisplayFormat | The format of the string inside the input |
Returns:
Sets the locale of the control.
Used for parsing and formatting the time values in languages different than English. Necessary for translation and auto-complete of the day periods, such as AM and PM.
Parameters:
{string} | sLocaleId | A locale identifier like 'en_US' |
Returns:
Sets the valueFormat
property.
Parameters:
{string} | sValueFormat | The format of strings that are set as value to the control |
Returns: