Skip to content

@serenity-is/corelib / PropertyDialog

Class: PropertyDialog<TItem, P>

Defined in: src/ui/dialogs/propertydialog.tsx:14

A dialog that edits a single entity's properties using a property grid, with OK/Cancel buttons and optional static panel behavior.

Extends

Type Parameters

TItem

TItem

Entity row type.

P

P

Widget props type.

Constructors

Constructor

new PropertyDialog<TItem, P>(props?): PropertyDialog<TItem, P>

Defined in: src/ui/dialogs/propertydialog.tsx:36

Creates a property dialog and loads property items.

Parameters

props?

WidgetProps<P>

Widget props forwarded to the base dialog.

Returns

PropertyDialog<TItem, P>

Overrides

BaseDialog.constructor

Properties

dialog

protected dialog: Dialog

Defined in: src/ui/dialogs/basedialog.tsx:25

Inherited from

BaseDialog.dialog


domNode

readonly domNode: HTMLElement

Defined in: src/ui/widgets/widget.ts:24

The DOM node this widget is bound to.

Inherited from

BaseDialog.domNode


idPrefix

readonly idPrefix: string

Defined in: src/ui/widgets/widget.ts:22

The id prefix used for this widget's child element ids.

Inherited from

BaseDialog.idPrefix


options

protected readonly options: WidgetProps<P>

Defined in: src/ui/widgets/widget.ts:18

The widget's options/props.

Inherited from

BaseDialog.options


propertyGrid

protected propertyGrid: PropertyGrid

Defined in: src/ui/dialogs/propertydialog.tsx:282


propertyItemsData

protected propertyItemsData: PropertyItemsData

Defined in: src/ui/dialogs/propertydialog.tsx:20


tabs

protected tabs: Fluent<HTMLElement>

Defined in: src/ui/dialogs/basedialog.tsx:22

Inherited from

BaseDialog.tabs


toolbar

protected toolbar: Toolbar

Defined in: src/ui/dialogs/basedialog.tsx:23

Inherited from

BaseDialog.toolbar


uniqueName

readonly uniqueName: string

Defined in: src/ui/widgets/widget.ts:20

A unique name for this widget instance, used for event namespacing.

Inherited from

BaseDialog.uniqueName


validator

protected validator: any

Defined in: src/ui/dialogs/basedialog.tsx:24

Inherited from

BaseDialog.validator


[typeInfo]

static [typeInfo]: ClassTypeInfo<"Serenity.">

Defined in: src/ui/dialogs/propertydialog.tsx:15

Overrides

BaseDialog.[typeInfo]


isComponent

readonly static isComponent: true = true

Defined in: src/ui/widgets/widget.ts:334

Inherited from

BaseDialog.isComponent

Accessors

dialogTitle

Get Signature

get dialogTitle(): string

Defined in: src/ui/dialogs/basedialog.tsx:291

Returns the current dialog title.

Returns

string

The dialog title.

Set Signature

set dialogTitle(value): void

Defined in: src/ui/dialogs/basedialog.tsx:296

Sets the dialog title.

Parameters
value

string

Returns

void

Inherited from

BaseDialog.dialogTitle


element

Get Signature

get element(): Fluent

Defined in: src/ui/widgets/widget.ts:82

Returns a Fluent(this.domNode) object

Returns

Fluent

Inherited from

BaseDialog.element


entity

Get Signature

get entity(): TItem

Defined in: src/ui/dialogs/propertydialog.tsx:246

Returns the current entity.

Returns

TItem

The entity.

Set Signature

set entity(value): void

Defined in: src/ui/dialogs/propertydialog.tsx:251

Sets the current entity.

Parameters
value

TItem

Returns

void


entityId

Get Signature

get entityId(): any

Defined in: src/ui/dialogs/propertydialog.tsx:259

Returns the current entity id.

Returns

any

The entity id.

Set Signature

set entityId(value): void

Defined in: src/ui/dialogs/propertydialog.tsx:264

Sets the current entity id.

Parameters
value

any

Returns

void


props

Get Signature

get props(): WidgetProps<P>

Defined in: src/ui/widgets/widget.ts:307

Returns the widget's props/options.

Returns

WidgetProps<P>

Inherited from

BaseDialog.props

Methods

addCssClass()

protected addCssClass(): void

Defined in: src/ui/dialogs/basedialog.tsx:73

Hook for subclasses to add CSS classes; the class goes to the dialog/modal/panel element.

Returns

void

Inherited from

BaseDialog.addCssClass


addValidationRule()

Call Signature

addValidationRule(rule, uniqueName?): void

Defined in: src/ui/widgets/widget.ts:142

Adds a validation rule to the widget's DOM node.

Parameters
rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

uniqueName?

string

A unique name for the rule, or the rule function when the two-argument overload is used.

Returns

void

Inherited from

BaseDialog.addValidationRule

Call Signature

addValidationRule(uniqueName, rule): void

Defined in: src/ui/widgets/widget.ts:143

Adds a validation rule to the widget's DOM node.

Parameters
uniqueName

string

A unique name for the rule, or the rule function when the two-argument overload is used.

rule

(input) => string

The validation rule function, or a unique name when the two-argument overload is used.

Returns

void

Inherited from

BaseDialog.addValidationRule


afterInit()

protected afterInit(): void

Defined in: src/ui/dialogs/propertydialog.tsx:57

Hook invoked after the dialog is initialized.

Returns

void


afterRender()

protected afterRender(callback): void

Defined in: src/ui/widgets/widget.ts:228

Queues a callback to run after the widget's contents are rendered.

Parameters

callback

() => void

The callback to run after rendering.

Returns

void

Inherited from

BaseDialog.afterRender


arrange()

arrange(): void

Defined in: src/ui/dialogs/basedialog.tsx:248

Triggers layout on all elements that require it.

Returns

void

Inherited from

BaseDialog.arrange


byId()

protected byId<TElement>(id): Fluent<TElement>

Defined in: src/ui/widgets/widget.ts:154

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

Fluent<TElement>

A Fluent wrapper for the matching element.

Inherited from

BaseDialog.byId


cancelClick()

protected cancelClick(): void

Defined in: src/ui/dialogs/propertydialog.tsx:131

Closes the dialog with a cancel result.

Returns

void


change()

change(handler): void

Defined in: src/ui/widgets/widget.ts:179

Registers a change handler on the widget's DOM node.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

BaseDialog.change


changeSelect2()

changeSelect2(handler): void

Defined in: src/ui/widgets/widget.ts:188

Registers a change handler that ignores changes originating from combobox setting values.

Parameters

handler

(e) => void

The change event handler.

Returns

void

Inherited from

BaseDialog.changeSelect2


deferRender()

protected deferRender(): boolean

Defined in: src/ui/widgets/widget.ts:98

Determines whether rendering should be deferred until init is called.

Returns

boolean

True to defer rendering.

Inherited from

BaseDialog.deferRender


destroy()

destroy(): void

Defined in: src/ui/dialogs/propertydialog.tsx:71

Cleans up the property grid and delegates to the base destroy.

Returns

void

Overrides

BaseDialog.destroy


dialogClose()

dialogClose(result?): void

Defined in: src/ui/dialogs/basedialog.tsx:283

Closes the dialog with the given result.

Parameters

result?

string

The close result.

Returns

void

Inherited from

BaseDialog.dialogClose


dialogOpen()

dialogOpen(asPanel?): void

Defined in: src/ui/dialogs/basedialog.tsx:158

Opens the dialog, optionally as a panel.

Parameters

asPanel?

boolean

When true, opens as a panel instead of a modal dialog.

Returns

void

Inherited from

BaseDialog.dialogOpen


findById()

protected findById<TElement>(id): TElement

Defined in: src/ui/widgets/widget.ts:163

Finds a child element by its prefix-relative id.

Type Parameters

TElement

TElement extends HTMLElement = HTMLElement

Parameters

id

string

The id relative to the widget's id prefix.

Returns

TElement

The matching element, or null if not found.

Inherited from

BaseDialog.findById


getCssClass()

protected getCssClass(): string

Defined in: src/ui/widgets/widget.ts:106

Returns the CSS class(es) applied to the widget's DOM node.

Returns

string

The space-separated CSS class string.

Inherited from

BaseDialog.getCssClass


getCustomAttribute()

protected getCustomAttribute<TAttr>(attrType, inherit): TAttr

Defined in: src/ui/widgets/widget.ts:220

Returns a custom attribute applied to the widget's type.

Type Parameters

TAttr

TAttr extends CustomAttribute

Parameters

attrType

(...args) => TAttr

The attribute type to look up.

inherit

boolean = true

Whether to search inherited types; defaults to true.

Returns

TAttr

The matching attribute, or null.

Inherited from

BaseDialog.getCustomAttribute


getDialogButtons()

protected getDialogButtons(): DialogButton[]

Defined in: src/ui/dialogs/propertydialog.tsx:94

Returns the dialog buttons; static panels have none.

Returns

DialogButton[]

Dialog button definitions.

Overrides

BaseDialog.getDialogButtons


getDialogOptions()

protected getDialogOptions(): DialogOptions

Defined in: src/ui/dialogs/propertydialog.tsx:84

Returns the dialog options with a narrower width.

Returns

DialogOptions

Dialog options.

Overrides

BaseDialog.getDialogOptions


getFormKey()

protected getFormKey(): string

Defined in: src/ui/dialogs/propertydialog.tsx:151

Returns the form key derived from the dialog class name.

Returns

string

The form key.


getGridField()

getGridField(): Fluent

Defined in: src/ui/widgets/widget.ts:171

Returns the closest .field element containing the widget's DOM node.

Returns

Fluent

A Fluent wrapper for the grid field.

Inherited from

BaseDialog.getGridField


getInitialDialogTitle()

protected getInitialDialogTitle(): string

Defined in: src/ui/dialogs/basedialog.tsx:81

Returns the initial dialog title.

Returns

string

The initial title text.

Inherited from

BaseDialog.getInitialDialogTitle


getPropertyGridOptions()

protected getPropertyGridOptions(): PropertyGridOptions

Defined in: src/ui/dialogs/propertydialog.tsx:170

Returns the options for the property grid.

Returns

PropertyGridOptions

Property grid options.


getPropertyItems()

protected getPropertyItems(): PropertyItem[]

Defined in: src/ui/dialogs/propertydialog.tsx:183

Returns the property items for this dialog.

Returns

PropertyItem[]

The property items.


getPropertyItemsData()

protected getPropertyItemsData(): PropertyItemsData

Defined in: src/ui/dialogs/propertydialog.tsx:191

Loads the property items data, either from script data or local items.

Returns

PropertyItemsData

The property items data.


getPropertyItemsDataAsync()

protected getPropertyItemsDataAsync(): Promise<PropertyItemsData>

Defined in: src/ui/dialogs/propertydialog.tsx:214

Asynchronously loads the property items data.

Returns

Promise<PropertyItemsData>

A promise resolving to the property items data.


getSaveEntity()

protected getSaveEntity(): TItem

Defined in: src/ui/dialogs/propertydialog.tsx:227

Returns the entity populated from the property grid.

Returns

TItem

The saved entity.


getToolbarButtons()

protected getToolbarButtons(): ToolButton[]

Defined in: src/ui/dialogs/basedialog.tsx:193

Returns the toolbar buttons for this dialog.

Returns

ToolButton[]

Tool button definitions.

Inherited from

BaseDialog.getToolbarButtons


getValidatorOptions()

protected getValidatorOptions(): any

Defined in: src/ui/dialogs/basedialog.tsx:215

Returns the validator options for the form.

Returns

any

Validator options.

Inherited from

BaseDialog.getValidatorOptions


handleResponsive()

protected handleResponsive(): void

Defined in: src/ui/dialogs/basedialog.tsx:314

Handles responsive layout for the dialog.

Returns

void

Inherited from

BaseDialog.handleResponsive


init()

init(): this

Defined in: src/ui/widgets/widget.ts:243

Initializes the widget, rendering its contents if rendering was deferred.

Returns

this

This widget instance.

Inherited from

BaseDialog.init


initDialog()

protected initDialog(): void

Defined in: src/ui/dialogs/basedialog.tsx:128

Initializes the underlying dialog element.

Returns

void

Inherited from

BaseDialog.initDialog


initPropertyGrid()

protected initPropertyGrid(): void

Defined in: src/ui/dialogs/propertydialog.tsx:138

Initializes the property grid from the PropertyGrid element.

Returns

void


initTabs()

protected initTabs(): void

Defined in: src/ui/dialogs/basedialog.tsx:304

Initializes the tabs from the Tabs element.

Returns

void

Inherited from

BaseDialog.initTabs


initToolbar()

protected initToolbar(): void

Defined in: src/ui/dialogs/basedialog.tsx:200

Initializes the toolbar from the Toolbar element.

Returns

void

Inherited from

BaseDialog.initToolbar


initUIDialog()

protected initUIDialog(): void

Defined in: src/ui/dialogs/basedialog.tsx:140

Initializes jQuery UI dialog-specific behavior.

Returns

void

Inherited from

BaseDialog.initUIDialog


initValidator()

protected initValidator(): void

Defined in: src/ui/dialogs/basedialog.tsx:222

Initializes the form validator.

Returns

void

Inherited from

BaseDialog.initValidator


internalRenderContents()

internalRenderContents(): void

Defined in: src/ui/widgets/widget.ts:266

Renders the widget's contents and runs any queued after-render callbacks.

Returns

void

Inherited from

BaseDialog.internalRenderContents


isClosable()

protected isClosable(): boolean

Defined in: src/ui/dialogs/propertydialog.tsx:25

Whether the dialog can be closed; false for static panels.

Returns

boolean

True when the dialog is closable.


isStatic()

protected isStatic(): boolean

Defined in: src/ui/dialogs/propertydialog.tsx:30

Whether the dialog renders as a static (non-closable) panel.

Returns

boolean

True when static.


isStaticPanel()

protected isStaticPanel(): boolean

Defined in: src/ui/dialogs/basedialog.tsx:89

Whether the dialog renders as a static panel.

Returns

boolean

True when static.

Inherited from

BaseDialog.isStaticPanel


legacyTemplateRender()

protected legacyTemplateRender(): boolean

Defined in: src/ui/widgets/widget.ts:291

Renders the widget from a legacy getTemplate string, if defined.

Returns

boolean

True if a legacy template was rendered.

Inherited from

BaseDialog.legacyTemplateRender


loadInitialEntity()

protected loadInitialEntity(): void

Defined in: src/ui/dialogs/propertydialog.tsx:238

Loads an empty entity into the property grid.

Returns

void


okClick()

protected okClick(): void

Defined in: src/ui/dialogs/propertydialog.tsx:113

Handles the OK button click, validating before saving.

Returns

void


okClickValidated()

protected okClickValidated(): void

Defined in: src/ui/dialogs/propertydialog.tsx:124

Closes the dialog with an OK result after validation passes.

Returns

void


onClose()

onClose(handler, opt?): void

Defined in: src/ui/dialogs/basedialog.tsx:180

Attaches a dialog/modal/panel close event handler. See Dialog.close for more info.

Parameters

handler

(result?, e?) => void

opt?
before?

boolean

oneOff?

boolean

Returns

void

Inherited from

BaseDialog.onClose


onDialogClose()

protected onDialogClose(result?): void

Defined in: src/ui/dialogs/basedialog.tsx:258

Hook invoked when the dialog closes; destroys the dialog and removes its element.

Parameters

result?

string

The close result.

Returns

void

Inherited from

BaseDialog.onDialogClose


onDialogOpen()

protected onDialogOpen(): void

Defined in: src/ui/dialogs/basedialog.tsx:172

Hook invoked when the dialog opens; focuses the first input and arranges layout.

Returns

void

Inherited from

BaseDialog.onDialogOpen


onOpen()

onOpen(handler, opt?): void

Defined in: src/ui/dialogs/basedialog.tsx:185

Attaches a dialog/modal/panel open event handler. See Dialog.open for more info.

Parameters

handler

(e?) => void

opt?
before?

boolean

oneOff?

boolean

Returns

void

Inherited from

BaseDialog.onOpen


propertyItemsReady()

protected propertyItemsReady(itemsData): void

Defined in: src/ui/dialogs/propertydialog.tsx:48

Called once property items are available; initializes the property grid and loads the initial entity.

Parameters

itemsData

PropertyItemsData

Property items data.

Returns

void


render()

render(): any

Defined in: src/ui/widgets/widget.ts:253

Returns the main element for this widget or the document fragment. As widgets may get their elements from props unlike regular JSX widgets, this method should not be overridden. Override renderContents() instead.

Returns

any

Inherited from

BaseDialog.render


renderContents()

protected renderContents(): any

Defined in: src/ui/dialogs/propertydialog.tsx:288

Renders the dialog contents with a form and property grid.

Returns

any

The rendered content.

Overrides

BaseDialog.renderContents


resetValidation()

protected resetValidation(): void

Defined in: src/ui/dialogs/basedialog.tsx:233

Resets all validation state.

Returns

void

Inherited from

BaseDialog.resetValidation


syncOrAsyncThen()

protected syncOrAsyncThen<T>(syncMethod, asyncMethod, then): void

Defined in: src/ui/widgets/widget.ts:318

Runs a method synchronously or asynchronously depending on the widget's useAsync flag, then invokes a continuation.

Type Parameters

T

T

Parameters

syncMethod

() => T

The synchronous method to run.

asyncMethod

() => PromiseLike<T>

The asynchronous method to run.

then

(v) => void

The continuation invoked with the result.

Returns

void

Inherited from

BaseDialog.syncOrAsyncThen


updateTitle()

protected updateTitle(): void

Defined in: src/ui/dialogs/propertydialog.tsx:279

Hook for subclasses to update the dialog title.

Returns

void


useAsync()

protected useAsync(): boolean

Defined in: src/ui/dialogs/propertydialog.tsx:64

Whether property items should be loaded asynchronously.

Returns

boolean

True when async loading is used.


useIdPrefix()

protected useIdPrefix(): IdPrefixType

Defined in: src/ui/widgets/widget.ts:329

Returns an id prefix helper for resolving child element ids.

Returns

IdPrefixType

An IdPrefixType proxy for this widget's id prefix.

Inherited from

BaseDialog.useIdPrefix


validateBeforeSave()

protected validateBeforeSave(): boolean

Defined in: src/ui/dialogs/propertydialog.tsx:272

Validates the form before saving.

Returns

boolean

True when the form is valid.


validateForm()

protected validateForm(): boolean

Defined in: src/ui/dialogs/basedialog.tsx:241

Validates the form.

Returns

boolean

True when the form is valid.

Inherited from

BaseDialog.validateForm


create()

static create<TWidget, P>(params): TWidget

Defined in: src/ui/widgets/widget.ts:202

Creates a widget instance from the given params, appending its element to the container and invoking the init/init callbacks.

Type Parameters

TWidget

TWidget extends Widget<P>

P

P

Parameters

params

CreateWidgetParams<TWidget, P>

The widget creation params.

Returns

TWidget

The created widget instance.

Inherited from

BaseDialog.create


createDefaultElement()

static createDefaultElement(): HTMLDivElement

Defined in: src/ui/dialogs/basedialog.tsx:20

Creates the default DOM element for a widget.

Returns

HTMLDivElement

A new div element.

Inherited from

BaseDialog.createDefaultElement


getWidgetName()

static getWidgetName(type): string

Defined in: src/ui/widgets/widget.ts:131

Returns the widget name for a type, used for association and unique names.

Parameters

type

Function

The widget type.

Returns

string

The widget name.

Inherited from

BaseDialog.getWidgetName


registerClass()

protected static registerClass<TypeName>(typeName, intfAndAttr?): ClassTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:342

Registers this type as a class with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

ClassTypeInfo<TypeName>

The class type info.

Inherited from

BaseDialog.registerClass


registerEditor()

protected static registerEditor<TypeName>(typeName, intfAndAttr?): EditorTypeInfo<TypeName>

Defined in: src/ui/widgets/widget.ts:357

Registers this type as an editor with the given type name.

Type Parameters

TypeName

TypeName

Parameters

typeName

StringLiteral<TypeName>

The type name to register.

intfAndAttr?

(InterfaceType | AttributeSpecifier)[]

Optional interfaces and attributes.

Returns

EditorTypeInfo<TypeName>

The editor type info.

Inherited from

BaseDialog.registerEditor