InputBase

known direct subclasses: ComboBoxTextField, DatePicker, DatePicker, Input, MaskInput, TextArea

The sap.m.InputBase control provides a base functionality of the Input controls, e.g. sap.m.Input, sap.m.DatePicker, sap.m.TextArea, sap.m.ComboBox.

Since: 1.12.0.

Constructor Summary

new sap.m.InputBase(sId?, mSettings?)Constructor for a new InputBase.

Field Summary

bShowLabelAsPlaceholderUse labels as placeholder configuration.

Event Summary

change(oControlEvent)Is fired when the text in the input field has changed and the focus leaves the input field or the enter key is pressed.

Events borrowed from class sap.ui.core.Control

validateFieldGroup

Events borrowed from class sap.ui.base.ManagedObject

formatError, modelContextChange, parseError, validationError, validationSuccess

Method Summary

sap.m.InputBase.extend(sClassName, oClassInfo?, FNMetaImpl?)Creates a new subclass of class sap.m.InputBase with name sClassName and enriches it with the information contained in oClassInfo.

sap.m.InputBase.getMetadata()Returns a metadata object for class sap.m.InputBase.

addAriaLabelledBy(vAriaLabelledBy)Adds some ariaLabelledBy into the association ariaLabelledBy.

applyFocusInfo(oFocusInfo)Applies the focus info.

attachChange(oData?, fnFunction, oListener?)Attaches event handler fnFunction to the change event of this sap.m.InputBase.

bindValue(oBindingInfo)Binds property value to model data.

closeValueStateMessage()Close value state message.

detachChange(fnFunction, oListener)Detaches event handler fnFunction from the change event of this sap.m.InputBase.

fireChange(mArguments?)Fires event change to attached listeners.

fireChangeEvent(sValue, oParams?)Fires the change event for the listeners

getAccessibilityInfo()

getAriaLabelledBy()Returns array of IDs of the elements which are the current targets of the association ariaLabelledBy.

getDomRefForValueStateMessage()Get the reference element which the message popup should dock to.

getEditable()Gets current value of property editable.

getEnabled()Gets current value of property enabled.

getFocusInfo()Returns an object representing the serialized focus information.

getName()Gets current value of property name.

getPlaceholder()Gets current value of property placeholder.

getRequired()Gets current value of property required.

getSelectedText()Retrieves the selected text.

getShowValueStateMessage()Gets current value of property showValueStateMessage.

getTextAlign()Gets current value of property textAlign.

getTextDirection()Gets current value of property textDirection.

getValue()Gets current value of property value.

getValueState()Gets current value of property valueState.

getValueStateText()Gets current value of property valueStateText.

getWidth()Gets current value of property width.

onChange(oEvent)Handles the change event.

onValueRevertedByEscape(sValue)Hook method that gets called when the input value is reverted with hitting escape.

openValueStateMessage()Open value state message popup.

removeAllAriaLabelledBy()Removes all the controls in the association named ariaLabelledBy.

removeAriaLabelledBy(vAriaLabelledBy)Removes an ariaLabelledBy from the association named ariaLabelledBy.

selectText(iSelectionStart, iSelectionEnd)Selects the text within the input field between the specified start and end positions.

setEditable(bEditable)Sets a new value for property editable.

setEnabled(bEnabled)Sets a new value for property enabled.

setName(sName)Sets a new value for property name.

setPlaceholder(sPlaceholder)Sets a new value for property placeholder.

setRequired(bRequired)Sets a new value for property required.

setShowValueStateMessage(bShowValueStateMessage)Sets a new value for property showValueStateMessage.

setTextAlign(sTextAlign)Sets a new value for property textAlign.

setTextDirection(sTextDirection)Sets a new value for property textDirection.

setValue(sValue)Setter for property value.

setValueState(sValueState)Setter for property valueState.

setValueStateText(sValueStateText)Setter for property valueStateText.

setWidth(sWidth)Sets a new value for property width.

unbindValue()Unbinds property value from model data.

updateDomValue(sValue)Sets the DOM value of the input field and handles placeholder visibility.

bindToInputEvent(fnCallback)Registers an event listener to the browser input event.

Methods borrowed from class sap.ui.core.Control

Methods borrowed from class sap.ui.core.Element

Methods borrowed from class sap.ui.base.ManagedObject

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

Methods borrowed from class sap.ui.base.EventProvider

attachEvent, attachEventOnce, detachEvent, hasListeners

Constructor Detail

new sap.m.InputBase(sId?, mSettings?)

Constructor for a new InputBase.

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
- value : string
- width : sap.ui.core.CSSSize
- enabled : boolean (default: true)
- valueState : sap.ui.core.ValueState (default: None)
- name : string
- placeholder : string
- editable : boolean (default: true)
- valueStateText : string
- showValueStateMessage : boolean (default: true)
- textAlign : sap.ui.core.TextAlign (default: Initial)
- textDirection : sap.ui.core.TextDirection (default: Inherit)
- required : boolean (default: false)
Events
- change : 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.

Parameters:

{string}	sId?	ID for the new control, generated automatically if no ID is given
{object}	mSettings?	Initial settings for the new control

Field Detail

bShowLabelAsPlaceholder

Use labels as placeholder configuration. It can be necessary for the subclasses to overwrite this when native placeholder usage causes undesired input events or when placeholder attribute is not supported for the specified type. https://html.spec.whatwg.org/multipage/forms.html#input-type-attr-summary

See:: sap.m.InputBase#oninput

Event Detail

change(oControlEvent)

Is fired when the text in the input field has changed and the focus leaves the input field or the enter key is pressed.

Parameters:

{sap.ui.base.Event}	oControlEvent
{sap.ui.base.EventProvider}	oControlEvent.getSource
{object}	oControlEvent.getParameters
{string}	oControlEvent.getParameters.value	The new `value` of the `control`.

Method Detail

sap.m.InputBase.extend(sClassName, oClassInfo?, FNMetaImpl?): function

Creates a new subclass of class sap.m.InputBase with name 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.

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

sap.m.InputBase.getMetadata(): sap.ui.base.Metadata

Returns a metadata object for class sap.m.InputBase.

Returns:

{sap.ui.base.Metadata}

Metadata object describing this class

addAriaLabelledBy(vAriaLabelledBy): sap.m.InputBase

Adds some ariaLabelledBy into the association ariaLabelledBy.

Parameters:

{string|sap.ui.core.Control}

vAriaLabelledBy

the ariaLabelledBy to add; if empty, nothing is inserted

Since:: 1.27.0

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

applyFocusInfo(oFocusInfo)

Applies the focus info. To be overwritten by subclasses.

Parameters:

{object}

oFocusInfo

attachChange(oData?, fnFunction, oListener?): sap.m.InputBase

Attaches event handler fnFunction to the change event of this sap.m.InputBase.

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.m.InputBase itself.

Is fired when the text in the input field has changed and the focus leaves the input field or the enter key is pressed.

Parameters:

{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.m.InputBase` itself

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

bindValue(oBindingInfo): sap.m.InputBase

Binds property value to model data.

See ManagedObject.bindProperty for a detailed description of the possible properties of oBindingInfo

Parameters:

{object}

oBindingInfo

The binding information

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

closeValueStateMessage()

Close value state message.

Since:: 1.26

detachChange(fnFunction, oListener): sap.m.InputBase

Detaches event handler fnFunction from the change event of this sap.m.InputBase.

The passed function and listener object must match the ones used for event registration.

Parameters:

{function}	fnFunction	The function to be called, when the event occurs
{object}	oListener	Context object on which the given function had to be called

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

fireChange(mArguments?): sap.m.InputBase

Fires event change to attached listeners.

Expects the following event parameters:

value of type stringThe new value of the control.

Parameters:

{Map}

mArguments?

The arguments to pass along with the event

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

fireChangeEvent(sValue, oParams?)

Fires the change event for the listeners

Parameters:

{String}	sValue	value of the input.
{Object}	oParams?	extra event parameters.

Since:: 1.22.1

getAccessibilityInfo()

See:

{sap.ui.core.Control#getAccessibilityInfo}

getAriaLabelledBy(): sap.ui.core.Control[]

Returns array of IDs of the elements which are the current targets of the association ariaLabelledBy.

Since:: 1.27.0

Returns:

{sap.ui.core.Control[]}

getDomRefForValueStateMessage(): object

Get the reference element which the message popup should dock to.

Since:: 1.26

Returns:

{object}

DOM element which the message popup should dock to

getEditable(): boolean

Gets current value of property editable.

Defines whether the control can be modified by the user or not. Note: A user can tab to non-editable control, highlight it, and copy the text from it.

Default value is true.

Since:: 1.12.0

Returns:

{boolean} Value of property editable

getEnabled(): boolean

Gets current value of property enabled.

Indicates whether the user can interact with the control or not. Note: Disabled controls cannot be focused and they are out of the tab-chain.

Default value is true.

Returns:

{boolean} Value of property enabled

getFocusInfo(): object

Returns an object representing the serialized focus information. To be overwritten by subclasses.

Returns:

{object}

An object representing the serialized focus information.

getName(): string

Gets current value of property name.

Defines the name of the control for the purposes of form submission.

Returns:

{string} Value of property name

getPlaceholder(): string

Gets current value of property placeholder.

Defines a short hint intended to aid the user with data entry when the control has no value.

Returns:

{string} Value of property placeholder

getRequired(): boolean

Gets current value of property required.

Indicates that user input is required. This property is only needed for accessibility purposes when a single relationship between the field and a label (see aggregation labelFor of sap.m.Label) cannot be established (e.g. one label should label multiple fields).

Default value is false.

Since:: 1.38.4

Returns:

{boolean} Value of property required

getSelectedText(): string

Retrieves the selected text. Only supported for input control's type of Text, Url, Tel and Password.

Since:: 1.32

Returns:

{string}

The selected text.

getShowValueStateMessage(): boolean

Gets current value of property showValueStateMessage.

Indicates whether the value state message should be shown or not.

Default value is true.

Since:: 1.26.0

Returns:

{boolean} Value of property showValueStateMessage

getTextAlign(): sap.ui.core.TextAlign

Gets current value of property textAlign.

Defines the horizontal alignment of the text that is shown inside the input field.

Default value is Initial.

Since:: 1.26.0

Returns:

{sap.ui.core.TextAlign} Value of property textAlign

getTextDirection(): sap.ui.core.TextDirection

Gets current value of property textDirection.

Defines the text directionality of the input field, e.g. RTL, LTR

Default value is Inherit.

Since:: 1.28.0

Returns:

{sap.ui.core.TextDirection} Value of property textDirection

getValue(): string

Gets current value of property value.

Defines the value of the control.

Returns:

{string} Value of property value

getValueState(): sap.ui.core.ValueState

Gets current value of property valueState.

Visualizes the validation state of the control, e.g. Error, Warning, Success.

Default value is None.

Returns:

{sap.ui.core.ValueState} Value of property valueState

getValueStateText(): string

Gets current value of property valueStateText.

Defines the text that appears in the value state message pop-up. If this is not specified, a default text is shown from the resource bundle.

Since:: 1.26.0

Returns:

{string} Value of property valueStateText

getWidth(): sap.ui.core.CSSSize

Gets current value of property width.

Defines the width of the control.

Returns:

{sap.ui.core.CSSSize} Value of property width

onChange(oEvent): true|undefined

Handles the change event.

Parameters:

{object}

oEvent

Returns:

{true|undefined}

true when change event is fired

onValueRevertedByEscape(sValue)

Hook method that gets called when the input value is reverted with hitting escape. It may require to re-implement this method from sub classes for control specific behaviour.

Parameters:

{String}

sValue

Reverted value of the input.

Since:: 1.26

openValueStateMessage()

Open value state message popup.

Since:: 1.26

removeAllAriaLabelledBy(): sap.ui.core.Control[]

Removes all the controls in the association named ariaLabelledBy.

Since:: 1.27.0

Returns:

{sap.ui.core.Control[]}

An array of the removed elements (might be empty)

removeAriaLabelledBy(vAriaLabelledBy): sap.ui.core.Control

Removes an ariaLabelledBy from the association named ariaLabelledBy.

Parameters:

{int|string|sap.ui.core.Control}

vAriaLabelledBy

The ariaLabelledByto be removed or its index or ID

Since:: 1.27.0

Returns:

{sap.ui.core.Control} the removed ariaLabelledBy or null

selectText(iSelectionStart, iSelectionEnd): sap.m.InputBase

Selects the text within the input field between the specified start and end positions. Only supported for input control's type of Text, Url, Tel and Password.

Parameters:

{int}	iSelectionStart	The index into the text at which the first selected character is located.
{int}	iSelectionEnd	The index into the text at which the last selected character is located.

Since:: 1.22.1

Returns:

{sap.m.InputBase} this to allow method chaining.

setEditable(bEditable): sap.m.InputBase

Sets a new value for property editable.

Defines whether the control can be modified by the user or not. Note: A user can tab to non-editable control, highlight it, and copy the text from it.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is true.

Parameters:

{boolean} bEditable New value for property editable

Since:: 1.12.0

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setEnabled(bEnabled): sap.m.InputBase

Sets a new value for property enabled.

Indicates whether the user can interact with the control or not. Note: Disabled controls cannot be focused and they are out of the tab-chain.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is true.

Parameters:

{boolean} bEnabled New value for property enabled

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setName(sName): sap.m.InputBase

Sets a new value for property name.

Defines the name of the control for the purposes of form submission.

When called with a value of null or undefined, the default value of the property will be restored.

Parameters:

{string} sName New value for property name

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setPlaceholder(sPlaceholder): sap.m.InputBase

Sets a new value for property placeholder.

Defines a short hint intended to aid the user with data entry when the control has no value.

When called with a value of null or undefined, the default value of the property will be restored.

Parameters:

{string} sPlaceholder New value for property placeholder

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setRequired(bRequired): sap.m.InputBase

Sets a new value for property required.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is false.

Parameters:

{boolean} bRequired New value for property required

Since:: 1.38.4

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setShowValueStateMessage(bShowValueStateMessage): sap.m.InputBase

Sets a new value for property showValueStateMessage.

Indicates whether the value state message should be shown or not.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is true.

Parameters:

{boolean} bShowValueStateMessage New value for property showValueStateMessage

Since:: 1.26.0

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setTextAlign(sTextAlign): sap.m.InputBase

Sets a new value for property textAlign.

Defines the horizontal alignment of the text that is shown inside the input field.

When called with a value of null or undefined, the default value of the property will be restored.

Default value is Initial.

Parameters:

{sap.ui.core.TextAlign} sTextAlign New value for property textAlign

Since:: 1.26.0

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setTextDirection(sTextDirection): sap.m.InputBase

Sets a new value for property textDirection.

Defines the text directionality of the input field, e.g. RTL, LTR

When called with a value of null or undefined, the default value of the property will be restored.

Default value is Inherit.

Parameters:

{sap.ui.core.TextDirection} sTextDirection New value for property textDirection

Since:: 1.28.0

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

setValue(sValue): sap.m.InputBase

Setter for property value.

Default value is empty/undefined.

Parameters:

{string} sValue New value for property value.

Returns:

{sap.m.InputBase} this to allow method chaining.

setValueState(sValueState): sap.m.InputBase

Setter for property valueState.

Default value is None.

Parameters:

{sap.ui.core.ValueState} sValueState New value for property valueState.

Returns:

{sap.m.InputBase} this to allow method chaining.

setValueStateText(sValueStateText): sap.m.InputBase

Setter for property valueStateText.

Default value is empty/undefined.

Parameters:

{string} sValueStateText new value for property valueStateText

Since:: 1.26

Returns:

{sap.m.InputBase} this to allow method chaining

setWidth(sWidth): sap.m.InputBase

Sets a new value for property width.

Defines the width of the control.

When called with a value of null or undefined, the default value of the property will be restored.

Parameters:

{sap.ui.core.CSSSize} sWidth New value for property width

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

unbindValue(): sap.m.InputBase

Unbinds property value from model data.

Returns:

{sap.m.InputBase} Reference to this in order to allow method chaining

updateDomValue(sValue): sap.m.InputBase

Sets the DOM value of the input field and handles placeholder visibility.

Parameters:

{string}

sValue

value of the input field.

Since:: 1.22

Returns:

{sap.m.InputBase} this to allow method chaining.

bindToInputEvent(fnCallback): sap.m.InputBase

Registers an event listener to the browser input event.

Parameters:

{function}

fnCallback

Function to be called when the value of the input element is changed.

Deprecated:
Since 1.22. Instead, use event delegation(oninput) to listen input event.

Returns:

{sap.m.InputBase} this to allow method chaining.