Interaction
The form is an important part of a interaction page which lets you add and edit your data. There are two ways to add a form to your canvas. The most simple way is to drag the form to the the canvas. Another way is to drag a data field to your canvas (without first creating the empty form), and select "Create form". When you add a Form to your template, a grey box with text appears, for now this is still an empty form. You can add content by dragging fields or a complete list to the form.
The first checkmark next to the form widget is the validation rule. You can use this item to add a validation field to your form. When you add a validation rule you are prompted with the expression editor or this time the expression validator. Here you add the expression your field should be validated for.
You can use this widget to make a field or a complete form required. This bars you from executing a node exit if a form or field is not filled in properly. The requered field widget can also be enabled in the behavioral properties of a Form item itself.
You use this widget to add buttons to your template. When adding a button you get can choose which kind of action you want the button to do.
- Refresh screen: Refreshes your screen and checks all fields and validations.
- Execute flowchart: Choose a flowchart to be executed upon button press.
- Follow button exit: Choose or create a node exit to follow when this button in pressed. This is used to go to the next node in your flowchart, the arrow is where the button leads to.
- Navigate to: Go to a set navigation point upon button press.
- Open hyperlink: Create a button that leads to a hyperlink.
- Download file: This lets you download a file from your application.
After you have chosen the kind of button action you want, the button will appear on your template. It will show a colored box with a text field in it. You can change text shown on the button by selecting it.
The button also has a few button properties that lets you change the appearance and behavior of your button.
Visible when: Allows your to add a condition for user visibility of the button. This can be added/changed throught double click of the field. The expression editor will be opened, where you are able to create the condition.
Behavior: The behavioral properties allow you to change the button action. These are the same options you get when adding a button to your form or template. The icons match with the picture provided above.
Appearance: In appearance, you can change the look of your button. You can display it as a normal button, a hyperlink, a hyperlink button, an icon button or a picture as button. The button can be given different colors, an icon can be added, and the position of the icon relative to the text can be changed.
Tooltip: The button has the option to add a tooltip on its own. When you enable the tooltip you get the same options as when you add a tooltip using the tooltip widget.
Button group properties: gives you control over the placement of your buttons and how it interacts with other buttons in the same field. With the orientation you can control whether it fills its field from top to bottom and/or from left to right. The presentation lets you join buttons together or place them with a little space between them. With the alignment you can control to which side the content inside the button is aligned. The last option allows you to change the buttons size with four sizes ton choose form where medium is the default.
There also is a Free form item. This item lets you customize your form by adding read-only fields or buttons into the form.
Last modified 6mo ago