You build forms page in the Visual Designer by using form components that fit the purpose: Content component to display information, Input Field components to collect data from users or help them make choices, etc.
You can find all form components you can add to a page in the Toolbox panel.
Adding a component to a page
To add a component:
- Open your form in the Visual Designer. In the drop-down list ("Selected item") at the top of the Display Panel find and select the page you want to add a component to.
- Find the component you want to add to the page in the Toolbox panel, drag it to the place on the page you want it to be located and drop it there. See Drag-and-drop to learn how drag and drop works in the Visual Designer.
- When the component is dropped onto the page it becomes highlighted and the Properties panel shows properties related to this component. Set the component properties as necessary: for example for Text Field Component, give it a unique Field Name, set the Label or define Option Source for Select Field.
- Commit your changes by clicking on "Commit" button in Controls panel and then click "Preview Form" button to see your new component and test it.
Removing a component from a page
To remove a component:
- Open your form in the Visual Designer. In the drop-down list ("Selected item") at the top of the Display Panel find and select the page you want to remove a component from.
- Select the component you want to remove by clicking on it, the component becomes highlighted and the Properties panel shows its properties. To be certain that you selected the right component, double-check the properties, like Name, Label, etc.
- Click on "Delete this component" icon (red rubbish bin) in the top right corner of the Properties panel. You will be asked to confirm your intentions in the Confirmation Required pop-up window. Click "Confirm".
The component is removed from the page, its parent - a Group or Page component - is now highlighted and the Properties panel is refreshed with the Page or Group settings.
You have time to restore the deleted component till you made other changes and clicked Save button. If you want to restore the component click "Restore deleted component" icon that will appear at the top of Properties panel.