How to Add an Element to a Form

Overview

Adding a new element or custom type to a form is a simple operation. Firstly you open the Base Types or Custom Types panel in the Editor Accordion and identify which element you will be adding to your form.

Adding the element can then be done in one of two ways; Select and Click, and Drag and Drop.

Select and Click

Select the container you would like to add the element too, and click on the element type you would like to add. This will create that type as a child of the selected container at the position x: 0 and y: 0.

Using this method, you must have a container or other element that is capable of accepting child elements selected. If you have a non-container element selected, you will get the error:

If you click to add multiple times, the created elements will stack on top of each other. The element at the “top” of the stack will be the last element created.

Drag and Drop

Click and drag the element type from the Editor Accordion onto the container you would like to be the parent of the new element. The new element uses the top left position of the placeholder box to determine the position of the new element, not the position of the mouse cursor.

The parent container will be selected based on where the element is dropped. The currently selected element is not considered.

If you drag and element onto another element that isn’t a container, the parent of that element will be used as the parent for the new element.

Elements can be placed behind the Header bar at the top of the Editor. Use the “Toggle Header” button to access elements accidentally placed in that area.

Once you start dragging an element onto the canvas, you can’t undo the action by dragging the element back to the Editor Accordion. This will just create a new element underneath the Accordion. You should instead place the element and then delete it immediately.