Image Control

Image control is used to display properties of datatype Image from the associated ItemType.

Image control will display the picture stored in the vault. It can also load the picture stored on the server folder by setting default value of image property as “../images/ImageName.svg” on ItemType definition.

• Name: It is used to uniquely identify control inside the template.
• Label: It is used to show label on the control. It can be localized by defined Languages and Locales inside innovator.
• Data Type: It shows the type of the property as defined in the ItemType definition. In case of Image control, it will always be Image, and it is shown as disabled.
• Tooltip: Tooltip will be shown when you hover the mouse on the information icon on the form field. It is derived from the property bound to the control.
• Help Text: Help Text flyout will be shown when you click on the information icon on the form field label. It is derived from the property bound to the control.

• Show Label: If show label is selected as Yes, image will be shown with a label at top-left corner.

  

• Placement: It allows you to place the picture in the available space. By selecting placement as Automatic, picture will be scaled to available space without compromising aspect ratio. With Manual option, by setting width and alignment of the picture, height is computed with the help of aspect ratio.

  

• Access: It allows you to define roles which can access the control. Roles (in the form group identities) can be at Show and Edit level. When control is hidden because you do not have defined role, property associated with this control is not even fetched from server.
• Read Only: Based on the option selected for Read Only, control can become read-only even if you can edit the properties used inside the page with lock. You can select one of the options like ‘Yes’, ‘No’, ‘Expression’, or ‘Script’. Expression allows you to define a Boolean expression using properties from the current and previous pages (in case of multi-page application) to conditionally make the control read-only if expression is evaluated to true. Expression will be evaluated based on the cached property values on the client. Script allows you to write custom JavaScript code that should return Boolean value. If returned value is true, the control will be read-only.
• Display Condition: Based on the option selected for Display Condition, the control will be shown or hidden in the wizard at runtime. You can select one of the options like ‘Always Show’, ‘Always Hide’, ‘Expression’, or ‘Script’. Expression allows you to define a Boolean expression using properties from the current and previous pages (in case of multi-page application) to conditionally display the control if expression is evaluated to true. Expression will be evaluated based on the cached property values on the client. Script allows you to write custom JavaScript code that should return Boolean value. If the returned value is false, the control will be hidden.
• Reset Dependency: It allows you reset value of the control to the default if any of the controls defined in “Reset Dependency” have their value changed at runtime.
• Validations: Validation rules work on Image control similar to Text control. Please refer to Validations section of the Text control for complete details.
• Margin: It allows you to set required top, right, bottom, left margins with respect to adjacent controls.
• On Load: OnLoad event allows you to write custom logic that will be executed after the value in the control is loaded. Please refer to the Template Customization section for more details.

• On Change: OnChange event allows you to write custom logic that will be executed after the value in the control is updated. Please refer to the Template Customization section for more details.