Partial View¶
Introduction¶
A Partial View is a reusable UI fragment that is not an autonomous form and cannot be navigated to directly. It is designed to be embedded inside other forms — Normal Forms or even other Partial Views — wherever a shared or repeated UI component is needed.
Characteristics¶
- Has no route of its own — it cannot be accessed via a URL. It is always rendered as part of a parent form.
- Is referenced from within another form using the Partial View control from the Toolbox, which acts as a placeholder that is replaced at runtime by the Partial View's actual content.
- Has access to an additional Toolbox control not available in Normal Forms: the Template control, which defines named content slots that the parent form can populate with its own controls.
- Has its own Model, Controller Actions, Logic, and Event Listeners, scoped to the partial view itself. This allows a Partial View to encapsulate its own data-fetching, validation, and interaction logic independently of the parent form.
- Multiple instances of the same Partial View can be placed across different forms. All instances share the same definition — updating the Partial View's design or logic propagates automatically to every form that references it.
- Supports passing parameters from the parent form into the Partial View, allowing the same fragment to display context-specific data (e.g. a "Comments" partial that displays comments for the currently selected record in the parent form).
- Can communicate back to its parent form through events, enabling the parent to react to actions performed inside the partial (e.g. a "Save" button inside a partial triggering a refresh of a data list in the parent form).
Relationship with Parent Forms¶
A Partial View is always owned by a parent form at runtime. The parent form is responsible for placing the Partial View control on its canvas and, optionally, passing parameters into it. The Partial View handles its own internal logic but can surface results or notifications back to the parent through events.
This two-way relationship allows a clean separation of concerns: the Partial View owns its fragment of the UI and its associated logic, while the parent form owns the overall page structure and can react to what happens inside the partial.
When to Use¶
Use a Partial View in two main scenarios:
1. Reuse Across Multiple Forms¶
When the same UI structure needs to appear in more than one place in the application, define it once as a Partial View and reference it wherever needed. This avoids duplicating both the visual design and the underlying logic.
Examples: - An address input block (street, city, country, postal code fields with validation) used on both a Customer form and a Supplier form. - A comments section that appears on multiple record detail pages. - A file attachment widget used across several different entity forms. - A user avatar and name card that appears in multiple contexts.
2. Code Organization¶
When a single Normal Form becomes large and complex, you can extract logically distinct sections into Partial Views to keep the form manageable and the responsibilities clearly separated — even if those sections are only used in that one form.
Examples: - Splitting a complex order entry form into separate partials for "Order Header", "Order Lines", and "Shipping Details". - Isolating a multi-step wizard step into its own Partial View so its logic does not clutter the parent form's controller. - Extracting a heavily conditional UI section into a partial to improve the readability of the parent form's design.
Additional Features¶
Compared to Normal Forms, Partial View form models have additional capabilities.
Native Integration Tab¶
The Native Integration tab provides low-level extension points for the generated code of the Partial View:
- Import Modules — declare imports from existing libraries that the Partial View's native code should include.
- Code Extensions — write custom extensions to the native code that is generated for the Partial View, enabling advanced customization beyond what the visual editor supports.
Theme Tab¶
The Theme tab allows a Partial View to integrate its styling with the application's theme system. It has two purposes:
Style Variables¶
You can declare named style variables that the Partial View uses internally for its styling. For each variable you define:
| Field | Description |
|---|---|
| Name | The variable identifier used in CSS rules and in the theme model |
| Type | The kind of value — Color, Dimension, Font Family, Raw, etc. |
| Default Value | The fallback value used when no theme override is applied |
Once declared here, these variables appear inside the application's Theme model, where they can be assigned specific values per variation, variant, or theme configuration — just like any other theme variable.
Raw CSS Rules¶
Below the variable declarations, you can write raw CSS rules for the Partial View using the variables you defined. This keeps the Partial View's styles self-contained and theme-aware: the rules reference the declared variables, and the actual values are controlled through the theme model.
Template Control¶
The Partial View Toolbox includes an additional control not available in Normal Forms: the Template control.
When a Template is dropped onto a Partial View's canvas, it defines a named content slot. On the parent form, inside the Partial View control, a corresponding container appears for each Template slot. The parent form can then append any controls it needs into those containers.
This allows the Partial View to define its overall structure while delegating specific regions of its UI to the parent form — a pattern similar to slots or transclusion in component-based frameworks. It is useful when a Partial View needs to be reused across forms but certain parts of its content must vary per usage (e.g. a Splitter control).