@memberjunction/ng-entity-form-dialog

A reusable Angular dialog component that displays a MemberJunction entity form for viewing and/or editing any record from any entity. Supports showing the complete form or a specific section.

Deprecated for new code — use the generic forms-as-overlays stack in @memberjunction/ng-base-forms: <mj-form-dialog> / <mj-form-slide-in> / <mj-form-window> and MJFormPresenterService. It resolves the form (including interactive overrides + variants), wires the full event surface, supports per-instance EntityFormConfig, and now covers section mode via the SectionName input — the one capability that previously justified keeping this component. See /guides/FORMS_ARCHITECTURE_GUIDE.md. This package remains only for its existing consumer (simple-record-list) until that’s migrated; no new usage.

Overview

The EntityFormDialogComponent wraps MemberJunction’s dynamic form system inside a Kendo UI dialog window. It dynamically loads the registered form component for the given entity (including custom form overrides) and provides configurable Save/Cancel buttons with automatic record handling.

graph TD
    PARENT["Parent Component"] --> EFD["EntityFormDialogComponent"]
    EFD --> KD["Kendo Dialog Window"]
    EFD --> CD["ContainerDirective\n(Dynamic Loading)"]
    CD --> BFC["BaseFormComponent\n(or subclass)"]
    BFC --> BFSC["BaseFormSectionComponent"]

    style PARENT fill:#7c5295,stroke:#563a6b,color:#fff
    style EFD fill:#2d6a9f,stroke:#1a4971,color:#fff
    style KD fill:#2d8659,stroke:#1a5c3a,color:#fff
    style CD fill:#b8762f,stroke:#8a5722,color:#fff
    style BFC fill:#2d6a9f,stroke:#1a4971,color:#fff
    style BFSC fill:#2d8659,stroke:#1a5c3a,color:#fff

Features

• Universal entity support: Works with any MemberJunction entity
• Two display modes: Complete form or single named section
• Configurable buttons: Show/hide Save and Cancel independently
• Automatic save handling: Optionally saves the record when user clicks Save
• Auto-revert on cancel: Optionally reverts record changes when user cancels
• Resizable dialog: Configurable width and height with user-resizable window
• Dynamic form loading: Uses @RegisterClass to load the correct form component

Installation

npm install @memberjunction/ng-entity-form-dialog

Key Dependencies

Dependency	Purpose
@memberjunction/core	Entity metadata, BaseEntity
@memberjunction/ng-base-forms	BaseFormComponent, BaseFormSectionComponent
@memberjunction/ng-container-directives	Dynamic component loading
@memberjunction/ng-shared	SharedService
@progress/kendo-angular-dialog	Kendo UI dialog window
@progress/kendo-angular-buttons	Dialog action buttons

Usage

<mj-entity-form-dialog
  [Title]="'Edit Contact'"
  [Record]="contactRecord"
  [Visible]="isDialogOpen"
  [Mode]="'complete'"
  [ShowSaveButton]="true"
  [ShowCancelButton]="true"
  [HandleSave]="true"
  [AutoRevertOnCancel]="true"
  [Width]="800"
  [Height]="600"
  (DialogClosed)="onDialogClosed($event)">
</mj-entity-form-dialog>

Inputs

Input	Type	Default	Description
Title	string	''	Dialog title bar text
Record	BaseEntity	null	The entity record to display
Visible	boolean	false	Controls dialog visibility
Mode	'complete' | 'section'	'complete'	Show entire form or specific section
SectionName	string	''	Section name (when Mode is 'section')
ShowSaveButton	boolean	true	Show the Save button
ShowCancelButton	boolean	true	Show the Cancel button
HandleSave	boolean	true	Auto-save record on Save click
AutoRevertOnCancel	boolean	true	Auto-revert record on Cancel click
Width	number	800	Dialog width in pixels
Height	number	600	Dialog height in pixels

Outputs

Output	Type	Description
DialogClosed	EventEmitter<'Save' | 'Cancel'>	Emitted when dialog closes with action taken

Exported API

Export	Type	Description
EntityFormDialogComponent	Component	The dialog component
EntityFormDialogModule	NgModule	Module declaration

Build

cd packages/Angular/Explorer/entity-form-dialog && npm run build

License

ISC