Faizatech Support
← All products

Multistep Form

Editor & Flow

The Editor tab is where you configure logic after tagging elements on the canvas.

Sub-tabs

Sub-tab Purpose
Flow Step order, branching conditions, actions on edges
Validation Required, regex, min/max, match field, presets
Variables Input, URL param, default sources; formulas
Visibility Show/hide fields, steps, or elements
Actions Redirect, setVariable, webhook, calculate, etc.
Settings Navigation, progress, after-submit, webhooks

Flow canvas

  1. Click Load canvas to import tagged steps from the Webflow canvas.
  2. Steps connect linearly by default.
  3. Add Condition nodes for branching (yes/no handles to different steps).
  4. Add Action nodes on paths (set variable, webhook, redirect, etc.).
  5. Click Save to write config to the form element and backend.

You can also Load from staging to parse a published .webflow.io page and rebuild the flow from HTML.


Validation

  • Required, regex, min/max length, min/max number, match field
  • Presets: email, phone, URL
  • Validation mode (Settings):
    • perStep — validate current step on Next
    • allOnSubmit — validate all rules on Submit only

Tag error text elements with data-msf-error-for="{fieldName}" so the runtime can display messages.


Variables & formulas

  • Sources: form input, URL parameter, or default value
  • Formulas: @[fieldA] + @[fieldB]
  • Display with data-msf-display="variableName" or inline @[variableName] in text

Actions

Trigger When it runs
On submit Before form POST
After submit After form POST
On step enter When entering a specific step

Types: redirect, setVariable, showElement, hideElement, webhook, calculate


Settings highlights

Group Options
Navigation Entry step, auto-next, auto-next on select, validation mode
Progress Save progress, resume progress, progress bar, progress steps
After submit Success message, redirect, conditional success, webhooks