Skip to main content

Multi-Row Input

Multi-Row Input edits an addable and removable array of objects through child fields. It participates in the state, validation, and submission boundary of its Form.

1. When to use it​

Typical uses:

  • Emergency contacts
  • Order lines and expense items
  • A bounded collection of repeated business records

2. Add and configure​

  1. Add Multi-Row Input to the Fields slot of a Form Section.
  2. Set a stable, unique Field Key / Name that matches the backend DTO property.
  3. Configure the component properties below, then add Required, Help Text, Full row, or conditions as needed.
  4. Check the initial value and layout in Design Preview, then use Form Validate / Submit to test the full data path.

3. Main properties​

PropertyPurpose
FieldsDefines the data shape used for binding, submission, or responses.
Max RowsLimits the allowed count, length, or value range.
Show Label / Show HeaderControls how the field is displayed in Design Preview and Runtime.
Table LayoutControls how the field is displayed in Design Preview and Runtime.
Hide New / Hide DeleteEnables or disables this behavior.
ValidatorDefines the data shape used for binding, submission, or responses.

Common properties such as Field Key, Required, Help Text, Full row, and Visible When come from the Form field contract. The table highlights the settings most relevant to Multi-Row Input.

4. Form value and backend contract​

Submitted value: An array of objects whose properties come from child Field Keys in Multi-Row Input.

[
{"name": "Alex", "relationship": "Manager", "phone": "+1 555 0100"}
]

The example shows the data shape only. The API must still validate type, range, and authorization against its business DTO.

5. Validation, conditions, and interactions​

Every field can use Form properties such as Required, Visible When, Disabled When, Required When, Dependencies, and Clear When Hidden. Conditions improve interaction but never replace backend validation or authorization.

Component capabilities: Supports setValue so buttons, Steps, or other actions can write the field value.

6. Recommendations​

Recommendations: Fix the request and response JSON contract before configuring the field, then test array items, file metadata, and server error paths end to end.

Return to the Form overview for layout, validation, submission, drafts, and backend protocol guidance.