Skip to main content

Slider

Slider selects a number or numeric range with a slider. It participates in the state, validation, and submission boundary of its Form.

1. When to use it​

Typical uses:

  • Percentages and thresholds
  • Budget or price ranges
  • Values where relative position matters more than exact typing

2. Add and configure​

  1. Add Slider 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
Min Value / Max ValueLimits the allowed count, length, or value range.
Initial ValueSets the initial value, content, or format used by the field.
Dual Slider ModeEnables or disables this behavior.
Initial Min / Max ValueSets the initial value, content, or format used by the field.
MarksControls how the field is displayed in Design Preview and Runtime.
Disable SliderEnables or disables this behavior.

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

4. Form value and backend contract​

Submitted value: A number in normal mode, or [minimum, maximum] in Dual Slider Mode.

65

[20, 80]

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: Validate minimum, maximum, and precision on both client and server. Visual marks never replace submission validation.

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