Popover
A popover element allows mask sections to be configured, which are displayed in a popover bubble at a desired time. The popover can be aligned with any other element.
Sample representation of a popover container
Image: When clicking on the name of the passenger, a freely configured popover is displayed, which shows more details about the passenger.
Configuration
In edit mode, the popover is always represented by a placeholder element as a substitute. The popover is displayed/hidden when clicked and can be configured and populated with elements like an ordinary element container.
Align with element: When the form is executed in test or live mode, the placeholder element is hidden and the popover is aligned with the linked element. The visibility of the popover is controlled by the visibility of the popover element (actions: Show element/Hide element).
Position: In which position (relative to the linked element) the popover appears can be influenced via the Position property. However, if the popover does not have enough space, it will be displayed at the nearest position.
Tip: With the Align popover action, both element assignment and position can be defined dynamically accordingly.
Display in form style: This checkmark decides whether the popover will be displayed in the default tooltip or form style.
Close on 'click out': A checkmark defines whether the popover should be automatically hidden when the user clicks outside the popover bubble.
Display arrow: A checkmark indocates whether the popover arrow should be shown or hidden.
Positions
auto
Das The popover automatically selects its position.
left, top, right, bottom
An attempt is made to place the popover appropriately next to the element.
centered
Aligns the popover centered on the linked element. Recommended for use with layout containers.
Layout: 'Popover CSS Class' special property
For a popover element, the property "Popover CSS class" is available in the layout category. This value is synchronized directly into the popover element in the DOM.
On the other hand, the default property "CSS class" is set to the content container of the popover as usual.