2
ZerionSoftware.com
GoToWebinar Control Panel
3
ZerionSoftware.com
4
ZerionSoftware.com
What are Smart Controls and how to
use them
iFormBuilder Built-in Functions
Element Dynamic Attributes &
Reference ID’s
Form Dynamic Attributes & Reference
ID’s
Building a Smart Form Demo
Agenda
5
ZerionSoftware.com
What are Smart
Controls & How
to Use Them
ZerionSoftware.com
What are Smarter Forms?
Adding logic to create custom forms,
eliminating human error and user interaction.
Limit characters through Data Size attributes
HTTP Request Element (Online Required)
Use of Smart Controls and/or Page Level JavaScript
Location Element Smart Controls
Segmented Option Lists
iFormBuilder Built-in Functions
Look-up Element
Reference ID’s and Dynamic Attributes
ZerionSoftware.com
What are Smart Controls?
Tools:
W3Schools.com
JSFiddle
JavaScript Tips and Tricks
ZerionSoftware.com
What are Smart Controls?
Smart Controls are created using
Javascript statements.
Statements include element Names
(also called Data Column Names or DCN)
and parent Form Name.
Each Smart Control, Dynamic Value,
Condition Value, Dynamic Label,
Client Validation and Client Message has
its own purpose.
ZerionSoftware.com
What are Smart Controls?
Dynamic Values allow an element to…
have a default value
base its value on another element
Tips and Tricks:
refer to elements using their DCN
use Date() to default to today’s date
For more resources...
Dynamic Value Articles
Date Object Reference
Dynamic Value
Condition Value
Dynamic Label
Client Validation
Validation Message
ZerionSoftware.com
Dynamic Value
Condition Value
Dynamic Label
Client Validation
Validation Message
What are Smart Controls?
Condition Values enable...
an element to be hidden so
it cannot be altered
adaptive routing based on other form values
Tips and Tricks:
use false to hide an element
use ZCDisplayKey for option list key values
For more resources...
Using Condition Values
Skip Logic
ZerionSoftware.com
What are Smart Controls?
Dynamic Value
Condition Value
Dynamic Label
Client Validation
Validation Message
Dynamic Label creates…
Custom labels for elements, based off of a
previous element’s response.
Tips and Tricks:
Use ZCDisplayValue_ built-in function when
using a label from an option list selection.
Personalize a label by configuring Smart
Control statement with iformbuilder.FirstName
For more resources...
Add Dynamic Label to your form
ZerionSoftware.com
Dynamic Label
Displays users answer from a previous element in another element.
Use elements data column names.
Example:
Users previous answer displayed in follow-up question.
What are Smart Controls: Dynamic Label
ZerionSoftware.com
Dynamic Value
Condition Value
Dynamic Label
Client Validation
Validation Message
What are Smart Controls?
Client Validation allows...
form builders to prevent illegitimate elements
for multiple validation criteria
Tips and Tricks:
use || for or and && for and
For more resources...
Using Client Validation
Date Validation
ZerionSoftware.com
Dynamic Value
Condition Value
Dynamic Label
Client Validation
Validation Message
What are Smart Controls?
Validation Messages help...
instruct data collectors
enforce complex criteria
Tips and Tricks:
use the DCN to include the
value in the message
text must be nested inside quotes
not supported by localization
For more resources...
Email Validation
ZerionSoftware.com
Adding Client Validation
Remember to put plain text inside quotation marks
ZerionSoftware.com
New Smart Control Best Practice to clear Caching
(September 2023)
https://support.zerionsoftware.com/hc/en-us/articles/18586281937563
WHAT ARE SEMANTIC REFERENCES?
With the release of iForm 10.8, we have implemented a new, more efficient way of implementing Javascript using semantic
references or what we refer to internally as SPT (Self, Parent, Top).
self: references the value within the current record.
parent: references the value within the direct parent record.
top: reference the value within the top-most record.
WHAT ARE THE BENEFITS?
By using semantic references, there is no need to use the full-form path, which makes copying forms and writing long
JavaScript functions more efficient while preventing caching issues.
ZerionSoftware.com
New Smart Control Best Practice to clear Caching
(September 2023)
Form Package Download: https://support.zerionsoftware.com/hc/en-us/article_attachments/18706019529115
18
ZerionSoftware.com
iFormBuilder
Built-in
Functions
ZerionSoftware.com
iFormBuilder Built-in Functions
User, APP and back-end Information — Displays the user information, information on the app they are using and the details from the backend.
Having these built-in functions added to a form can greatly improve user experience, help troubleshoot and assist in integrations.(Blue=Links)
Username Logged-in: iformbuilder.username
First Name of User Logged-in: iformbuilder.firstName
Last Name of User Logged-in: iformbuilder.lastName
Email of User Logged-in: iformbuilder.email
OS Type — iformbuilder.osType
OS Version — iformbuilder.osVersion
App Version — iformbuilder.appVersion
App Name — iformbuilder.appName
Form Version — iformbuilder.formVersion
Device Model — iformbuilder.deviceModel
Device Language — iformbuilder.deviceLanguage
Server Name: iformbuilder.serverName
User ID: iformbuilder.userID — (Shows the User ID (ex. 12345) instead of the username.)
Profile ID: iformbuilder.profileID
Page ID: iformbuilder.pageID — (Shows the Page ID (form ID) of the form the user is entering data in.)
Form Name: iformbuilder.formName — (Shows name with _’s)
Form Label: iformbuilder.formLabel – (Shows the label of the form, as seen on the device)
Import Form Package:
https://5eae6d99ac972a7f9f39-bd6eca24a608a68763319e6efcdf3d9f.ssl.cf2.rackcdn.com/training/407235/built_in_form_template_22_p/fi
eld_1022348276650afba6db6cb.json
ZerionSoftware.com
iFormBuilder Built-in Functions
Location Data
By placing iFormBuilder built-in functions into the Dynamic Value of an element, you can automatically capture a
user's location data. The following is a list of the location data that can be captured.
iformbuilder.location.latitude: This function will return the latitude data.
iformbuilder.location.longitude: This function will return the longitude data.
iformbuilder.location.altitude: This function will return the altitude data.
iformbuilder.location.speed: This function will return the speed data.
iformbuilder.location.accuracy: This function will return the accuracy data.
iformbuilder.location.horizontalAccuracy: This function will return the horizontal accuracy data.
iformbuilder.location.verticalAccuracy: This function will return the vertical accuracy data.
iformbuilder.location.time: This function will return the time data.
iformbuilder.location.string: This function will return all location data in one string.
ZerionSoftware.com
iFormBuilder Built-in Functions
Subform AggregationAdds or finds the
average of the values from the records taken in a
Subform and displays the sum of those values in
the Parent Form.
iformbuilder.math.sum
iformbuilder.math.avg
getNextSeqence()Allows the user to keep
track how many records they have provided.
ZerionSoftware.com
iFormBuilder Built-in Functions: Subform Aggregation
Subform Aggregation: Sum and Average
Under the Subform element on the parent form, in the field in which you would like
the Sum or Average to be displayed, place the following syntax in the Dynamic Value.
iformbuilder.math.sum(table_name.subform_element_dcn, ‘element_on_subform')
Or
iformbuilder.math.avg(table_name.subform_element_dcn, ‘element_on_subform')
Replace the above text with your DCN’s:
table_name: Parent Form Table name
subform_element_dcn: The Subform element's DCN on the Parent Form.
element_on_subform: The element's DCN on the Subform.
Example: iformbuilder.math.sum(bj_smart_controls_demo_march2014_parent.subform_to_aggregate_totals, 'addition1')
ZerionSoftware.com
iFormBuilder Built-In Functions: Option List
ZCDisplayKey
This key is the recommended practice with Smart
Controls. Much like ZCDisplayValue, but will use the
key value instead of option label. This is recommended
practice as it gives you the freedom of changing the
order or labels of options within a list without breaking
your smart control statement
Example:
In the Condition Value of a new text element, place
ZCDisplayKey_my_pick_list_dcn ==“other” to have
the text element displayed ONLY is other is selected
from the picklist.
ZCDisplayValue
There may be times when you want to use or view the
"Label" of an option list rather than the Key Value or
Sort Order. This function could be used to give the user
freedom to add more details to an option, or modify the
selection(s) they made.
Example:
In the Dynamic Value of a new text element, place
ZCDisplayValue_my_pick_list_dcn== “other” to
have the label of the option selected displayed.
Best Practice: Use ZCDisplayKey to allow for changing the label or sort order without breaking Smart Controls.
Note: Text in “quotes” must match case of key value or label in option list.
24
ZerionSoftware.com
Element Dynamic
Attributes &
Reference ID’s
ZerionSoftware.com
Element Dynamic Attributes
Customize the behavior of
elements with the Dynamic
Attributes.
Currently for Elements:
Multi-Photo
HTTP Request
Look-up
Time
Date-Time
ZerionSoftware.com
Ability to take multiple photos
quickly and in one element
Add Dynamic Attributes to:
Force Camera
Force Library
Define number of photos (default is 6)
Stores Data as JSON object
Community request
Dynamic Attributes of Multi Photo
ZerionSoftware.com
Dynamic Attributes of Lookup Element
Sort: The Sort Dynamic Attribute will allow users to choose
the order in which columns are displayed.
https://iformbuilder.zendesk.com/hc/en-us/articles/360029935672-
How-do-I-sort-Lookup-data-
Filter: Filter attribute restricts the selectable/viewable records
based on criteria you determine using filters such as equal to, like,
greater than, less than, etc.
https://iformbuilder.zendesk.com/hc/en-us/articles/360029662312-
How-do-I-filter-the-Lookup-element-data-table-
Read-Only: The Read-Only Dynamic Attribute allows users to
only view the data included in the Lookup table. This can be
useful in scenarios where users only need to view previous
records and not actually populate a new record with the data.
https://iformbuilder.zendesk.com/hc/en-us/articles/360030264311-
How-do-I-make-lookup-data-read-only-
Max: The Max Dynamic Attribute allows users to limit the
number of rows returned when using the Lookup element.
To implement this attribute, follow the instructions below.
https://iformbuilder.zendesk.com/hc/en-us/articles/360029478
012-How-do-I-limit-the-number-of-rows-shown-in-the-Lookup-
element-
ZerionSoftware.com
Element Reference IDs
Reporting Reference IDs
ELEMENT_SKIP_REPORT: Element will not show up on your reports
PDF, Excel, etc.
ELEMENT_REPORT: Will print "Label" widget on PDF and email reports
ELEMENT_SKIP_EMAIL_PDF: Element will not show on PDF Reports
and Email Reports but will show in Data Views and Data Feeds
Specific Element Reference IDs
SUBFORM_BATCH_MODE: Upon pressing done on a multi-paging subform,
it will open up a new subform record. When you are finished adding subform
records, press cancel to return to the parent form.
PHOTO_LIBRARY_DISABLED: Limits the Image and Drawing widget to only leverage the camera.
CAMERA_DISABLED: Limits the Image and Drawing widget to only leverage the image library.
COUNTER_STEPVALUE=X: Changes the Counter widget’s value (where X equals the number you
want to increase the count by)
DISABLE_LIST: Prefer to have users type information in, type in response
instead of using a picklist in Smart Table Search.
LOCATION_CHANGE_ENABLED: Ability to change a location in the Location element by clicking
inside the element.
29
ZerionSoftware.com
Form Properties:
Dynamic
Attributes &
Reference ID’s
ZerionSoftware.com
Form Properties: Advanced Properties
Dynamic Attributes: Form/Page Dynamic Attributes allow
for form functionality on the App.
Reference ID 1–5: Configurations for form in iForm App.
Reference ID Overview and Custom Form Menu Colors
(Discussed in more detail in following slides.)
Label Icons URL:
Place URL path for adding images or icons to a form.
Disable Form:
Form is no longer available in Form Assignment and hidden
in Form Builder.
ZerionSoftware.com
Form Properties: Form/Page Dynamic Attributes
Dynamic Attribute Description
Disable 'Delete Records' Button on
Device
This removes the Delete Records
icon from all devices for this form.
Update Assigned/Completed
Records
Enabling this option will update
Assigned or Completed Records if
that same record is re-assigned.
Map Priority Order of display on Map View
Map Top Location Disable Disable the top location from being
checked initially.
ZerionSoftware.com
Form Properties: Reference ID 1
* Only available on iOS
PAGETYPE_DAILYSUBMISSION Only one record can be submitted for that specific date. *
PAGETYPE_TIMEAWARE=9:00-19:00 Form is only available on the device during this timeframe. *
PAGETYPE_SINGLESUBMISSION Only submit one record per form. If this flag is applied to a form that has one or more
records collected you will not be able to collect any records from the device.
PAGETYPE_NEWFROMLASTRECORD Pre-populate field data from last submitted record in new record. *Need to have a local
record on the device to create copy from. Turn off 'Delete on Upload' in Device Settings)
PDF_SUBFORM_NEW_PAGE Create new page for subform(s) in PDF report
PAGETYPE_DWINDLINGOL=element_index This flag removes options from a list after they have been selected. To use, define
which element should assume this property (defined by the index value). *NOTE:
Option is only removed after a successful sync with the server. *
PAGETYPE_INFO No new record is created for the form and no data is uploaded from the device. Mainly
for use with informative forms. **Requires 4.2 client**)
ZerionSoftware.com
Form Properties: Reference ID 2
DISPLAYFIELD=0,1,2
(Shows data from specified fields in record view. The numbers represent the
element index with the first element always beginning with 0) Note: When using
this feature do not reference an element index value larger than the max element
index on the form or you will not be able view data in record view.
SORTFIELD=0,1,2
The primary difference is that SORTFIELD will display and sort the record view
of forms (including subforms) according to the element indexes that are defined.
If you define more than one element index value then the rows are sorted in that
order by the criteria specified. For instance, if an element “first name” has index of
0, and you apply “SORTFIELD=0” in Ref ID2, records will be sorted alphabetically
according to the input for “first name” in the record view on the device.
EXAMPLES:
DISPLAYFIELD=0,1,2
SORTFIELD=0,1,2
DISPLAYFIELD=0,1,2;SORTFIELD=0,1,2
(Ascending)
SORTFIELD= 0,1D,2 (Ascending by 1st column,
if same then Descending by 2nd column)
SORTFIELD= 0D
Configure what fields are being displayed in list view on device.
ZerionSoftware.com
Form Properties: Reference ID 3
You can view more information about any form by pressing
the O icon. A new screen will open where you can see the
description and details such as version history.
Reference ID 3 EXAMPLE:
FORMINFO_PROPERTYLIST=version,modified_date,modified_by
version Version number of the form.
created_by Who originally created the form.
created_date When the form was originally created.
modified_by Who was the last one to change the form.
modified_date When the form was last changed.
Taping “Version” will display all other details.
Configure what is displayed in the details section of a form.
ZerionSoftware.com
Form Properties: Reference ID 4
RECORD_DELETE_ON_UPLOAD
This will ensure every record created on this
form is deleted when the device syncs the record.
RECORD_NO_DELETE_ON_UPLOAD
This will save every completed record on this
form as a completed record on the device.
Override device “Delete on Upload” Settings.
ZerionSoftware.com
Form Properties: Reference ID 5
Adjust the color scheme for how each form displays in the Form Menu.
There are five different ways you can customize the look of the form view.
PLEASE NOTE:
Must use capital letters and hex values for colors.
If adding more than one code be sure to enter a semicolon (;)
after each code.
EXAMPLE:
FORMBRANDING_FORMLABELCOLOR=#008BDC;
FORMBRANDING_RECORDSTATUSCOLOR=# F29171;
FORMBRANDING_INFOTEXTCOLOR=#89655A;
FORMBRANDING_INFOBARCOLOR=#F29171;
FORMBRANDING_BORDERCOLOR=#89655A;
ZerionSoftware.com
Form Properties: Reference ID 5
Description Reference ID Example
Color of Form
Label Text
FORMBRANDING_FORMLABELCOLOR={hexvalue}; FORMBRANDING_FORMLABELCOLOR=#008BDC;
Color of Record
Status Icons
FORMBRANDING_RECORDSTATUSCOLOR={hexvalue}; FORMBRANDING_RECORDSTATUSCOLOR=#F29171;
Color of ( i )
Info Button
FORMBRANDING_INFOTEXTCOLOR={hexvalue}; FORMBRANDING_INFOTEXTCOLOR=#89655A;
Color of bottom
border and area
surrounding ( i )
FORMBRANDING_INFOBARCOLOR={hexvalue}; FORMBRANDING_INFOBARCOLOR=#F29171;
Color of entire
border and area
surrounding ( i )
FORMBRANDING_BORDERCOLOR={hexvalue}; FORMBRANDING_BORDERCOLOR=#89655A;
Hex Value Color Picker Website: http://htmlcolorcodes.com/
38
ZerionSoftware.com
39
ZerionSoftware.com
Building a Smart
Form: Demo
40
ZerionSoftware.com
Building a Smart Form: Demo
During the demo, we practiced the following:
Copy a form template
Place false in Condition Value to hide iFB Built-in Functions
Add a Multi-Photo element and configure Dynamic Attributes
Add Option List with Other Text Element using ZCDisplayKey_
Use Form/Page Reference ID 2 to configure Table view:
DISPLAYFIELD=
Connecting a Subform to a Parent form where number elements
have limited characters and use self.element_dcn to clear
cache.
4141
ZerionSoftware.com
Zerion Academy Asynchronous Courses Now
Available!
Upcoming Webinars:
October 4 - Public Link Forms, More Than Just a
Form
42
ZerionSoftware.com
How to Access Getting Started Asynchronous Courses
1. Create a user in Zerion Academy
https://zerionsoftware.docebosaas.com/learn
/register . We suggest creating a username
that is your email address. (Already have
one? Skip to step 3.)
2. Follow the steps in the email to confirm your
account and change your password.
3. Log in to Zerion Academy. Once logged in,
click on the following Learning Plan link. This
enrolls you and brings you to the learning
plan that contains the courses.
https://zerionsoftware.docebosaas.com//lms/i
ndex.php?r=coursepath/deeplink&id_path=2
1&hash=34ca05d869b49e9dd58548a4417cf
b1a98b7e83c&generated_by=13007