Forms
Bind form inputs, configure validation, and build repeatable sections using concrete Demo Projects HQ pages where possible.
Build Forms and Input Flows
Use this hub when you are building forms with real inputs, validation, or repeated fields. Start with the Demo Projects HQ-backed examples, then move into isolated form patterns.
Choose a forms path
Section titled “Choose a forms path”Start with real project form flows, then move into reusable input, validation, and repeat patterns.
Projects HQ-backed form flows
Form data sources on the task form
Use the Demo Projects HQ task form to see how App Connect and Server Connect data sources feed projects, contacts, and tag choices into real form controls.
Edit form state restoration
Use the Demo Projects HQ task edit form to see how existing record data restores text, select, date, and tag fields before the user starts editing.
Contact create and success handoff
Use the real contact add page to see how App Connect combines lookup data, submission state, and the success handoff into the new contact detail page.
Checkbox, autocomplete, and tags on edit forms
Use the Demo Projects HQ contact edit page to see how App Connect restores boolean, autocomplete, and tag-style controls before editing starts.
Contact delete confirmation and return handoff
Use the real contact edit page to see how App Connect keeps the destructive delete flow explicit with confirmation, request state, and a return-to-contacts handoff.
Files upload state and refresh
Use the Demo Projects HQ files page to see how App Connect form state, live data reloads, and repeated file listings stay in sync during uploads.
Tours
Form inputs & bindings
Use common form controls as live App Connect data sources in Wappler, and learn how bindings, events, and type conversion interact while users type, select, and toggle values.
Dynamic Select Menu
Build data-driven select menus that load the right options, keep selected values predictable, and stay readable as form complexity grows.
Form validation (Validator)
Client-side form validation: configure App Connect Validator and integrate with Bootstrap validation feedback and classes.
Form Repeat
Learn how Form Repeat structures nested form rows in Wappler so users can add, remove, reorder, and submit repeated data as one coherent request.
Nested repeats
Use Wappler’s Form Repeat and selection-aware Properties flow to understand how nested repeated rows get their data scope.
Check Multiple Checkboxes Dynamically
Keep checkbox groups in sync with data or page state without turning multi-select behavior into brittle manual wiring.
Related interaction patterns
Show or Hide Elements
Use conditional display in App Connect deliberately so the UI reacts to state without turning visibility logic into a maintenance problem.
Dynamic Attributes
Dynamic Attributes overview: use Properties ( + ) to add attributes, then inspect and bind values with picker icons and valid expressions.