Form designer
The 'Form designer' is one of the core tools in Lobster Data Platform / Orchestration. With it, all forms, dialogs and dashboards can be designed and provided with rudimentary program logic.
WYSIWYG editor
Forms and elements can (with a few exceptions) be built and configured in a 'what you see is what you get' manner.
Quick overview
The form designer is basically divided into four areas:
In the lower left area of the editor (1), all elements available for the corresponding context are presented, divided into sections. Which sections are visible here depends primarily on the type of shape. In the case of a shipment form, for example, only those sections are available which also match a shipment, such as shipment line items or number of packages. The elements can be dragged onto the form (2) and further configured (3) via drag & drop.
The composition of the listed categories also depends on the currently selected element in the form. If, for example, an element within a container for shipment line items is selected in the form, sections matching the shipment line items are provided (see screenshot below).
It is also possible to extend the available attributes (e.g. text values) by extending Dynamischer Aufzählungen.
Under the Layout Section (A) components can be found, which are mainly used for clarity, such as tab titles or display texts but also additional user interfaces such as buttons or checkboxes.
In the Tree View (4), the components already used on the form are represented in a tree structure, which primarily serves for clarity, in addition in such a way ensures in addition, a simpler operation regarding the selection or shifting of elements.
►NOTE◄ By dragging an element from the form (2) back to the element selection or by pressing the Remove button, a component can be removed from the form again. In cases of drag & drop, a corresponding 'Delete' symbol appears.
Selected elements in the form or in the tree view can also be edited with the following key combinations:
|
Common Shortcut |
Apple Shortcut |
Effect |
|
Strg + C |
Cmd + C |
Copies the selection in the tree or layout to the clipboard. |
|
Strg + X |
Cmd + X |
Cuts the selection in the tree layout to the clipboard. ►NOTE◄ The effect of cutting becomes visible only at the subsequent paste, because only then do the cut elements disappear. |
|
Strg + V |
Cmd + V |
To paste copied or cut clipboard contents at a position determined by the current selection. The paste function is only supported if exactly one element is selected as the target position. If this is an Element containers, the contents of the clipboard will be added within. In all other cases it will be pasted after the selected element. ►NOTE◄ If the position to paste is to be determined by a click in the layout, the click may activate the edit mode for the clicked element (e.g. a text field). In this case, the contents of the clipboard would be copied into the text field as a default value. If necessary, the selection must be executed in the tree. |
The area on the right side of the Form Editor (3) offers additional setting options, properties and behaviour configuration for the currently selected form components. Behaviours are understood to be configurable program modules that control the behaviour of the form elements (e.g: Show/hide elements, empty elements, call profiles, and much more. See Behaviour types and actions).
An overview of the common settings and configurations is provided by so-called indicators, which are displayed directly on the elements. The following list explains the symbolism:
|
Indicator symbol |
Meaning |
|
|
The element has at least one behaviour assigned to it. |
|
|
The element is invisible by default. |
|
|
It is a calculation field. |
|
|
An element container that embeds a form and automatically updates it on loading. See also Formulare einbetten (Sub-Formulare). |
|
|
This element has a tooltip that is displayed when the user hovers over it with the mouse cursor. This indicator is also displayed when the form is executed, if the corresponding option 'Show tooltip indicators' is not disabled in the form. This setting can also be made per element. |
The latest version of the form (also called template) is only available to users after it has been activated by clicking the Publish button (9). This allows changes to be saved without overwriting the current version of the form for the user.
To ensure a multilingual input form, the properties of the elements can be defined depending on the Language (6).
Tip: Using the Translate button (8), all localizable values can be translated directly into all supported languages as long as they already have either a defined resource or a fixed value in at least one language.
In cases of form-specific translations, it is recommended to enter fixed values in the current language when developing the form and then translate them directly in a single final step using the Translate function.
Forms can also be tested at any time by using the Testmode (7) ribbon button. Previous changes are not saved! When starting the test mode, empty test objects are loaded, which are discarded when the process is stopped.
►NOTE◄ The Testmode executes all configured behaviours and actions, as well as ready-made form functionalities. This means that profiles and services are called accordingly.
With the function History (10) all saved versions of the form can be viewed and restored.
The two additional tabs Form XML and Renderer XML show the XML representation of the form, which is stored in the database of the Lobster Data Platform / Orchestration system. While the Form XML can be edited (mainly used for form exchange or for advanced administrators), the Renderer XML is the version of the form that is 'published' and therefore available to the users of the system.
Tip: If a form is executed, it is possible to query which form was actually loaded by holding Ctrl/Cmd + Alt keys and clicking on the form.
In this example, the portal form '1301 – User search' was loaded'. Indicated by Ctrl/Cmd + Alt + click on the shape.
Next with: