v7.3.0

DisplayField
Widget

A read-only field widget for displaying a value inside a form or Container. Unlike TextField, this field does not allow user input — it simply renders a value. Use the optional template config to format the displayed output with custom HTML. DisplayField participates in form data collection just like other fields, making it useful for showing computed or server-provided values alongside editable fields.

const displayField = new DisplayField({
    appendTo : document.body,
    label    : 'Name',
    value    : 'John Doe'
});

// Using a template for custom formatting const ageField = new DisplayField({ appendTo : document.body, label : 'Age', value : 30, template : data => `${data.value} years old` });

Useful configs and properties

Config Description
label Label text displayed beside the value
value The value to display
template A function returning custom HTML for the displayed value
cls CSS class(es) for custom styling

See also

  • TextField - Editable text input field
  • Field - Base field class with label and validation support
  • Container - Parent container for arranging fields in a form layout
No results

Configs

Configs are options you supply in a configuration object when creating an instance of this class

Properties

Properties are getters/setters or publicly accessible variables on this class
type: displayField

Source path

Core/widget/DisplayField.js

Contents