Documentation

UIFormContextController

class UIFormContextController

extends UIRenderableController

Renderable wrapper that injects a form context record, to be used by (nested) child input controls.

Note: This wrapper does not group content in a cell; see also UIForm.

Note: Preset constructors for this class (see example) only accept one child component. To wrap multiple components, use multiple UIFormContextController constructors, or wrap child components in a UICell.

Form Context

The form context record is used by input components (e.g. text field, toggle/checkbox, and custom input components) to synchronize values displayed with the properties of any managed object.

  • Input components have a name property that’s used to identify the form context record property.
  • The form context record itself is provided by the UIFormContextController component, usually through a binding on its formContext property (see example below).
  • The form context record must already be created — this might be an instance of ManagedRecord or a custom class.
  • When the input value changes, the property is updated along with the new value.
  • When the form context record is set, or when a change event is emitted on the form context record, the displayed input value is updated. Note that simply changing the property value is not enough to trigger an update since properties themselves are not observable.

Example (preset)

UIFormContextController.with(
  { formContext: bind("inputContext") },
  UICell.with(
    UIRow.with(
      UITextField.withName("firstName", "First name"),
      UITextField.withName("lastName", "Last name")
    ),
    UIRow.with(
      UITextField.withName("country", "Country")
    )
  )
)

Constructor

(content?: UIRenderable): UIFormContextController

.formContext

ManagedRecord

Form state context; defaults to an empty managed record.

.renderContext

UIRenderContext

Inherited from UIRenderableController.renderContext.

.content

UIRenderable

Inherited from UIRenderableController.content.

.render()

(callback?: RenderCallback<Output<UIRenderable, any>>): void

Inherited from UIRenderableController.render.

.isPresetComponent() protected

(): boolean

Inherited from Component.isPresetComponent.

.getParentComponent()

[1]. (): Component
[2]. <TParent extends Component>(ParentClass: ComponentConstructor<TParent>): TParent

Inherited from Component.getParentComponent.

.getCompositeParent()

<TParent extends Component>(ParentClass?: ComponentConstructor<TParent>): TParent

Inherited from Component.getCompositeParent.

.propagateComponentEvent()

(name: string, inner?: ManagedEvent): void

Inherited from Component.propagateComponentEvent.

.managedId

number

Inherited from ManagedObject.managedId.

.managedState

ManagedState

Inherited from ManagedObject.managedState.

.getReferenceCount() protected

(): number

Inherited from ManagedObject.getReferenceCount.

.getManagedReferrers() protected

(): ManagedObject[]

Inherited from ManagedObject.getManagedReferrers.

.getManagedParent() protected

[1]. (): ManagedObject
[2]. <TParent extends ManagedObject>(ParentClass: ManagedObjectConstructor<TParent>): TParent

Inherited from ManagedObject.getManagedParent.

.emit()

<TEvent extends ManagedEvent = ManagedEvent, TConstructorArgs extends any[] = any[]>(e: string | TEvent | (new (...args: TConstructorArgs) => TEvent), ...constructorArgs: TConstructorArgs): this

Inherited from ManagedObject.emit.

.propagateChildEvents() protected

[1]. (f?: (this: this, e: ManagedEvent, propertyName: string) => void | ManagedEvent | ManagedEvent[]): this
[2]. (...types: (ManagedEvent | (new (...args: any[]) => ManagedEvent))[]): this

Inherited from ManagedObject.propagateChildEvents.

.activateManagedAsync() protected

(): Promise<any>

Inherited from ManagedObject.activateManagedAsync.

.deactivateManagedAsync() protected

(): Promise<void>

Inherited from ManagedObject.deactivateManagedAsync.

.destroyManagedAsync() protected

(): Promise<void>

Inherited from ManagedObject.destroyManagedAsync.

.onManagedStateActivatingAsync() protected

(): Promise<void>

Inherited from ManagedObject.onManagedStateActivatingAsync.

.onManagedStateActiveAsync() protected

(): Promise<void>

Inherited from ManagedObject.onManagedStateActiveAsync.

.onManagedStateDeactivatingAsync() protected

(): Promise<void>

Inherited from ManagedObject.onManagedStateDeactivatingAsync.

.onManagedStateInactiveAsync() protected

(): Promise<void>

Inherited from ManagedObject.onManagedStateInactiveAsync.

.onManagedStateDestroyingAsync() protected

(): Promise<void>

Inherited from ManagedObject.onManagedStateDestroyingAsync.


UIFormContextController.Presets

UIFormStateController presets type, for use with Component.with.

.formContext

ManagedRecord

Form state object; must be a (binding to a) managed record, see ManagedRecord.

.onFormContextChange

ComponentEventHandler<UIFormContextController, ComponentEvent>

Event handler for any change to the form state.

.onEnterKeyPress

ComponentEventHandler<UIFormContextController, ComponentEvent>

Event handler for Enter key presses (ignoring Enter key presses on multiline text fields and buttons, which do not emit the EnterKeyPress event).