Text Field Screen Component

Introduction

The Text Field Screen Component is a field into which the user can enter text using the keyboard. Unlike the Text Area, text is limited to a single line.

Text Field Screen Component (edit mode)

Text Field Screen Component (preview mode)

Configuration Properties

Properties Tab

Max. Length – Maximum number of characters the user is allowed to enter into the field. You can leave it blank to allow any length.
Text If Disabled – If this checkbox is selected, and the Text Area is disabled, its content is shown as text only, with no frame.
Input Type – Defines the HTML5 input type of the field (Number, Text, Email, URL, Telephone Number or Search Field). These input types are supported in most browsers, providing an enhanced UI for the selected input type. If your browser does not support the selected input type, the content is displayed as a regular text field instead.

Note: The Input Type setting does not enable browser-generated validation.

Disable Auto Completion – If this checkbox is selected, the autocomplete functionality provided by the browser is disabled.
Placeholder – Text to be displayed on the Text Field if no value has been set.

Note: if you set the Use Legacy Style option, the following legacy properties become available in the Properties tab: Size and Inline. From Appway 7 onwards, these styling properties are replaced by the Text Field Style Business Object.

If no value is entered into the Text Field, an empty string is submitted to the server.

Converter and Validators Tabs For information on converters, see the Converters and Validators section in the Screen Component: Configuration Properties article.

Actions Tab For complete information on Actions, see the General Properties article.

Text Field Style Business Object

The Text Field Style Business Object allows applying consistent styling to all Text Area Screen Components.

States

The Text Field Style Business Object has five different states:

Focused
Disabled
Error
ReadOnly

Styling Properties

These are the styling properties for the Text Field Style Business Object:

Outer Spacing – Defines the space between element outside the Text Area and the border.
Size – Sets both the width and height of the Text Area.
Error Box (virtual) – Refers to an ErrorBox (virtual) Style Business Object to define the style of the Text Area component and error message when in Error state.
Text Input (virtual) – Refers to a Text Input (virtual) Style Business Object to define style of the inserted text.
For more information on styling properties, see the Style Business Object: Styling Properties section.
For more information on virtual components, see the Style Business Objects Referencing Virtual Components section.