Updated: April 5, 2017

Label

sap.m.Label

Intro

A label is the name or title of a control or group of related controls.

Label
Label "Name" in a form

Usage

Use the label control if:

  • You need a label for a control. We recommend that you always use labels for form controls.

Do not use the label control if:

  • You want to insert a heading in the column header of a table.
  • You want to use it as an alternative for the text control, such as in display-only forms; do not use the label to display the data.

Types

There are two types of labels:

  • Required
  • Not required

To indicate that a field is mandatory, set the property:required. An asterisk will be automatically set in front of the label.

Required label in an editable form (horizontal layout)
Required label in an editable form (horizontal layout)
Label in a display-only form (horizontal layout)
Label in a display-only form (horizontal layout)
Non-required label in an editable form (horizontal layout)
Non-required label in an editable form (horizontal layout)
Label in a display-only form (horizontal layout)
Label in a display-only form (horizontal layout)
Non required label in an editable form (vertical layout)
Non required label in an editable form (vertical layout)
Label in a display-only form (vertical layout)
Label in a display-only form (vertical layout)

Guidelines

  • Always use a label for form controls.
  • Use title case for labels.
  • Do not use a placeholder (input prompt) as a replacement for the label.
  • Do not use bold labels.

Exceptions

The layout can sometimes be simplified by using a placeholder instead of the label control. This exception can be applied in the following cases:

  • When the form pattern is easily understood, such as on a login screen. Since this screen consists of only two input controls (username and password), the labels do not have to be used.
  • When the form is extremely small and has fewer than three input fields, such as in messaging and small feedback forms.
  • In search fields. For more information, see search.

Resources

Want to dive deeper? Follow the links below to find out more about related controls, the SAPUI5 implementation, and the visual design.

Elements and Controls

Implementation

  • Label (SAPUI5 samples)
  • Label (SAPUI5 API reference)