Skip to main content

Transfer

Transfer moves values between available and selected lists. It participates in the state, validation, and submission boundary of its Form.

1. When to use it​

Typical uses:

  • Member or permission assignment
  • Bulk resource selection
  • Cases that must show available and selected items together

2. Add and configure​

  1. Add Transfer 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
Data Source URLDefines where selectable data comes from and how it is mapped.
Target KeysDefines the data shape used for binding, submission, or responses.
One-Way StyleEnables or disables this behavior.
Show Search BoxEnables or disables this behavior.
Show Pagination / Items Per PageLimits the allowed count, length, or value range.
Width / HeightControls how the field is displayed in Design Preview and Runtime.

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 Transfer.

4. Form value and backend contract​

Submitted value: An array of values.

["permission.read", "permission.publish"]

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: Keep option values stable for backend enums or IDs. Labels may be localized, but must not be used as business keys.

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