Skip to content

WidgetReadOnly ​

Overview ​

Renders a field value as non-editable text, with optional prefix and suffix strings. When app and model props are provided, the raw foreign-key value is resolved to a human-readable name and rendered as a link to the related record's detail view.

Theme entry: WidgetReadOnly

Props ​

NameTypeRequiredDefaultDescription
nameStringundefinedThe widget name; falls back to the field context value when omitted.
labelStringundefinedThe label displayed next to the widget; falls back to the field context value when omitted.
helpStringundefinedHelp text displayed alongside the widget; falls back to the field context value when omitted.
readOnlyBooleanfalseWhether the widget is read-only; falls back to the field context value when omitted.
requiredBooleanundefined, // let the default from field context take overWhether the widget is required; falls back to the field context value when undefined.
modelValueString|Number|Boolean|Array|ObjectundefinedThe widget's bound value (v-model); used only in contextless mode.
fieldToWidgetObject|FunctionnullAdapter that converts the form model value into a value suitable for the widget UI.
widgetToFieldObject|FunctionnullAdapter that converts the widget UI value back into a form model value for validation and submission.
invalidBooleanundefinedManually set the invalid state when not in a field context.
warningBooleanundefinedManually set the warning state when not in a field context.
disabledBooleanfalseWhether the widget is disabled.
disabledFnFunctionnullA function that returns whether the widget should be disabled; takes precedence over the disabled prop.
contextlessBooleanfalseWhen true, the widget ignores any surrounding field or form context and manages its own state.
displayDependenciesArray() => []Field paths whose values the widget needs for display logic; registered with the field context.
themeOverrideObjectnullA partial ThemeObject keyed by component name, merged over this component's theme and provided to descendants.
appstringundefinedDjango app label used to resolve the foreign-key value to a display name and link.
modelstringundefinedDjango model name used to resolve the foreign-key value to a display name and link.
foreignKeyObjobjectundefinedPre-fetched related object; used instead of a lookup when already available.
loadingbooleanfalseWhen true, shows a loading indicator instead of the resolved value.
prefixstring""Static text prepended to the displayed value.
suffixstring""Static text appended to the displayed value.
optionsarray|booleanfalseStatic choice options used to resolve stored values to display labels.
optionLabelstring"label"Key on each option object used as the displayed label.
optionValuestring"value"Key on each option object used as the stored value.

Slots ​

default ​

Scoped slot.

Bindings ​

NameDescription
rawValue
value

Events ​

NameDescription
update:modelValueEmitted when the widget value changes.

Full event reference

Source ​

client/lib/widgets/WidgetReadOnly.vue