e-Form Components

Learn about e-Form components and their key properties.

Component Types

Example

Report components (to display data)

• Table, CrossTab, Chart - only for DataBand (for details, refer to Report Developer.)

• Label, Shape

Input components (to collect data)

• Input tab:

  • TextBox, ComboBox, RadioButton, CheckBox, SignPad, Camera, etc.

• Input Group tab:

  • RadioButtonGroup: Combine RadioButtons into a single option group.

• Input Filter tab:

  • StringTextFilter: Set pattern for TextBox display format such as Product code, Phone number, Card number, etc.

  • NumberTextFilter: Set specific number formats like currency, etc.

Component Properties

• Properties are broken down into five categories - Design, data, Appearance, Behavior, and Layout.

• Properties are different by component

Key properties

Category	Property	Description
Design	Type	Component types
	Name	Component object identifier
	Group Name	RadioButtonGroup or SignPad group
Data	Data Type	Data source
	Text	Value
	Source	Data source
Appearance	Drawing Type	Rendering style
	Color, Font, Border, etc.	Color, size, alignment, etc.
Behavior	Enable	Activate or deactivate the component
	Visible	Show or hide the component
	Tooltip Text
	Placeholder
	Max length	Max number of input characters
	AllowSending	Allow extrcating input value (JSON/XML)
	Text Filter Name	Input filter name to apply
	Text Input Mode	Keyboard, Barcode, NFC
	Required	for input validation
Layout	Location	Coordinates(x,y)
	Size	Width, Height

Adding Components

Default properties

Options > Components

• Set the default properties of components as you prefer.

Labels

A label can have various Drawing Types and Data Type properties.

• Text label

• Image label

• HTML label

• System label

• Barcode

Input Components

• Input components and their key properties are listed below.

• Some components have different looks and feel on the web and mobile screen.

Component	Key properties
TextBox	Tooltip Text Placeholder Multi Line
NumberTextFilter	Required Scale Max Scale
StringTextFilter	Pattern expression
NumericUpDown	Value (Initial value) Unit of change (Interval) Maximum value Minimum value
ComboBox	Items Selected Index Placeholder
CheckBox	CheckStyle Horizontal Check Alignment Frame Size
RadioButton	CheckStyle Horizontal Check Alignment Frame Size
RadioButtonGroup	Enable Uncheck: allow no choice MultiSelectable: allow multiple choices
ToggleButton	Items Selected Index Placeholder
Button	Text OnClick event: _MessageBox("Success");
AttachmentButton	TextAfterAttach: "Change File"
DateTimePicker	Format: "dd/MM/yyyy", "yyyy-MM-dd", etc.
SignPad	Width, Height, Image Format: SIGN_DATA
ImagePicker	ImagePickMode: Camera
VideoPlayer	Source: http://oz.ozeform.io:8080/training/assets/video.mp4

Editing Components

Layout tab (top menubar)

• Align, spacing, move, group multiple components

Copying components (Ctrl-C and Ctrl-V)

• Copy any component to create a new one.

• Report and band are copied with their components.

• Components can be copied even between ReportTemplates

Format Label (right-click drop-down)

• Appearance settings

Change Input Type (right-click drop-down)

• Change component type

FixedTable

• FixedTable can be used to add a group (section) of components.

• Insert, Delete, Cell Merge, Cell Divide

• Change cells to component types you want.

[esc] to select the FixedTable itself, not all the cells in the FixedTable.