InputFieldLocate this document in the navigation structure

The InputField UI element allows the user to edit or display a single-line text. You cannot only edit the value of the type String but also the value of any simple data type using an input field. The conversion of the string representation into the data type - known as parsing - and the conversion of the data type into the string presentation - known as formatting - are automatically executed.

When using an InputField, you must always add a label to ensure accessibility.

Description of UI Element Properties
  • activateAccessKey

    Indicates whether access key for this control should be activated.

    More information: Enabling Access Keys

  • alignment

    Specifies the horizontal alignment of the UI element in the grid. The default value of this property is auto. The alignment property can take the following values and is represented by the enumeration type WDInputFieldAlignment:

    auto

    The alignment is specified by the usage of the UI element - for example, by the displayed data type.

    beginOfLine

    The text content is always displayed at the beginning of line. Therefore, the text content for the value ltr of the textDirection property is left-justified. The text content for the value rtl is right-justified.

    center

    Centered alignment.

    endOfLine

    The text content is always displayed at the end of the line. Therefore, the text content for the value ltr of the textDirection property is right-justified. The text content for the value rtl is left-justified.

    forcedLeft

    The text content is always left-justified, regardless of whether the value is ltr or rtl for the textDirectionproperty.

    forcedRight

    The text content is always right-justified, regardless of whether the value is ltr or rtl for the textDirectionproperty.

    left

    Left-justified alignment. This value is deprecated. Use beginOfLine instead.

    right

    Right-justified alignment. This value is deprecated. Use forcedRight instead.

  • defaultDateRefId

    You can use this property to refer to another date field for example in start/end date scenario. The date of the referred date field is used to initialize the date picker if the date field has no own value.

  • displayAsText

    Specifies, whether the InputField looks like a text if it has not the focus.

  • displayLabelAsDefault

    This property is deprecated, use inputPrompt instead.

  • explanation

    determines the explanation text. More information: Explanation

  • imeMode

    An Input Method Editor (IME) allows users to enter and edit Chinese, Japanese, and Korean characters. The IME is an essential component for writing Chinese, Japanese, and Korean scripts. These writing systems have more characters than can be encoded for a regular keyboard. The IMEs for these languages use sequences of base characters that describe an individual character or group of characters to enter a larger set of characters. Base characters can be component letters from Hangul syllables, phonetic components for Japanese Kanji characters, or various combinations for Chinese characters.

    To compose text with an IME, the user generally uses dictionary lookup and contextual analysis, especially in languages where homonyms are frequent, as in Japanese. A user typically starts by entering a few component characters, optionally selecting from various choices, and a confirmation command.

    The imeMode property can be filled with the following values and is represented by the enumeration type WDIMEMode:

    • auto (default)
    • active
    • inactive
    • disabled
  • inputPrompt

    Specifies the text that is displayed if the InputField has no initial value.

    The following screenshot shows an example:

    InputField

  • length

    Specifies the maximum number of characters to be displayed in the input field.

  • onEnterBehavior

    The onEnterBehavior property can be filled with the following values and is represented by the enumeration type WDOnEnterBehavior.

    • default; Default behavior which is compatible to older releases. That means onEnter event will be fired if user selects an entry out of a proposal or a suggestion list.
    • noEnterOnSelection. If user selects an entry out of a proposal or a suggestion list no onEnter event will be fired.
  • passwordField

    Boolean value that controls the display of entered characters on the screen. If the value is true, the entered characters on screen are echoed with an asterisk (*). This attribute is usually used for password input fields.

  • readOnly

    Specifies whether the input field can be edited or read only. If the value is true, the displayed text can only be read.

  • size

    This property is deprecated and can no longer be used.

  • state

    Describes the state of the UI element. The data type of this property corresponds to the enumeration type WDState. You can use the following values in the application:

    normal

    Describes the default state of the UI element.

    required

    Specifies whether the entered value is required.

  • suggestValues

    Specifies whether suggest values are displayed while the user enters data. Prerequisite is that the InputField is bound to a data type for which value help is provided.

  • textDirection

    Specifies the text direction and allows you to use input fields for texts in languages which require a specific text direction. The textDirection property can be filled with the following values and is represented by the enumeration type WDTextDirection.

    inherit

    The text direction is inherited from the parent element. Therefore, the text direction is identical to the one of the parent element.

    ltr

    The text runs from left to right.

    rtl

    The text runs from right to left.

    The default value for this property is inherit .

  • value

    Specifies the character string displayed in the input field area. This property must be bound to a context attribute.

  • width

    Specifies the width of the input field that you can specify in CSS sizes, such as em, ex, pixels or percentage values.

Overview of Inherited and Additional Properties
Name Interface Type Initial Value Bindable

activateAccessKey

IWDAbstractInputField

boolean

false

not bindable

alignment

IWDAbstractInputField

WDInputFieldAlignment

auto

bindable

defaultDateRefId

IWDAbstractInputField

String

 

not bindable

displayAsText

IWDAbstractInputField

boolean

false

bindable

displayLabelAsDefault

IWDAbstractInputField

boolean

false

bindable

enabled

IWDUIElement

boolean

true

bindable

explanation

IWDInputField

String (Translatable Text)

 

not_bindable

imeMode

IWDInputField

WDIMEMode

auto

bindable

length

IWDAbstractInputField

int

20

bindable

onEnterBehavior

IWDInputField

WDOnEnterBehavior

default

bindable

passwordField

IWDAbstractInputField

boolean

false

bindable

readOnly

IWDAbstractInputField

boolean

false

bindable

state

IWDAbstractInputField

State

normal

bindable

suggestValues

IWDInputField

boolean

false

not bindable

textDirection

IWDAbstractInputField

WDTextDirection

inherit

bindable

tooltip

IWDUIElement

String (TranslatableText)

 

bindable

value

IWDAbstractInputField

String

 

bindable_mandatory

visible

IWDUIElement

WDVisibility

visible

bindable

width

IWDAbstractInputField

String

 

bindable

Events
  • onEnter

    This event is triggered when the user chooses ENTER. This event can be disabled by setting the property onEnterBehavior to noEnterOnSelection.

  • onChange

    This event is triggered when the InputField loses focus and the value has been changed.

Data binding

You can use the value property to bind data to an input field by assigning the path of the context attribute to this property.