You can quickly and easily add the ability to scan common barcodes and QR codes to any Form screen via the Barcode field type. This field provides the user with a "Scan" button that launches the device's camera (phone or tablet) or an external barcode scanner to perform barcode capture.
Basic Properties
Data Name
This is the name of the field that should be referenced in any form logic or API calls. Users will not see this name on the form.
Data names cannot contain spaces or any special characters other than an underscore and must begin with a letter. They are case-sensitive and must be referred to precisely whenever they are referenced.
Title Text
This is the name of the field that will be displayed to users on the app. This property is completely optional; while a field must contain a data name, a field title is optional.
The text color may be chosen with a hex code. The text may be also formatted as Bold or Italic and given a relative size -- Small, Medium (the default), or Large.
Hint Text
This optional field can be used to show secondary information to the user in the app. Consider using this to provide instruction or clarification to the user as they fill out the field.
Formatting options for this property are the same as those given available for the Title Text property.
Scan Device
This field allows you to configure how you intend to scan barcodes:
Device's Camera
External Barcode Reader
On Scan Action
This drop-down determines the action taken when the barcode is successfully scanned. So, for example, you could launch a new Screen or you could navigate to another page in a Form when the scan occurs. This opens up many new scenarios to make your apps even more dynamic. See our Form Recipes section for Barcode-specific articles - e.g., how to repeatedly scan barcodes / QR codes in your Forms.
- Create Email To - this will send an email to the address specified in the Pass Parameters field with the app's default email program. The parameter passed can include static text or field values. Pass values from fields in the form using the {{dataname}} syntax.
- Create SMS To - this will send an SMS message to the address specified in the Pass Parameters field with the app's default messaging program. The parameter passed can include static text or field values. Pass values from fields in the form using the {{dataname}} syntax.
Note that this can only be used on a device with messaging capability. - Dial Phone Number - this will dial the phone number specified in the Pass Parameters field with the app's default phone program. The parameter passed can include static text or field values. Pass values from fields in the form using the {{dataname}} syntax.
Note that this can only be used on a device with dialing capability. - Exit & Save Changes - this will save the form as a local draft and exit the form without prompting the user. This essentially saves the user two keystrokes, since going back and clicking "Save and Exit" will not be necessary.
- Force Sync - this will Force Sync the local device. This is a very useful action as it saves the user several keystrokes, bypassing the need to navigate to return to the device start screen and settings page.
- Geocode Address - this will convert an address text string into decimal latitude/longitude coordinates. The address must be provided in the "Pass parameter" field below and can be either static text or a form field reference with {{dataname}} syntax and in standard address format - i.e., Street Address, City, State/Province, Postal Code, Country or {{address}}, {{city}}, {{state}}, {{postal}}, {{country}}.
The geocoded coordinate result (if any) is populated into the field, with the result being "lat lon" - e.g., -13.3823724 153.9832837. The result will not be visible to the user unless the "Display Result to User" property is enabled (see Advanced Options further in this article).
- Jump to Form Location - this will allow the user to navigate to various parts of the form based on the target chosen in the "Target for interaction" field. These targets can be relative or specific - i.e., the next or previous page, or a specific page somewhere on the form.
Note that although by default the app goes to the first repeat if one exists when jumping to a repeatable page, the app can instead always create a new repeat, skipping over any pre-existing repeats, if the "Always Jump to New Repeat" checkbox is enabled.
- Open Doc - this will open a document from your document library (read more about this here). The target document can be a specific reference from the drop-down or a dynamic value determined by a passed parameter. For the latter, you may pass values from form fields using {{dataname}} syntax or specify the unique ID or external ID of the Doc to open using static text or field values.
- Open Entry - this will open the form entry specified in the "Pass parameters" field below. This parameter can be static text or dynamic reference based on a form field such as a choices field linked to the App: Entry History data source. Note that the latter will only work if previous form entries have been submitted on the local device. If none have been submitted, the user will receive an error message when opening the screen since the linked data source will be empty.
- Open Screen - this will open another screen. The target screen can be chosen in the drop-down, with parameters optionally passed in the field below. These parameters can be static text or dynamic values from the form using the {{dataname}} syntax.
For Form targets, you can preset target fields with "dataname:value," pipe-separated.
E.g., field1:{{city}}|field4:hello
For Listing and Mapping screen targets, you can pass in a formula for filtering the target rows. Use {{target[column]}} for target columns.
E.g., {{target[3]}} >= {{price}}
For Detail and Task Details targets, pass the identifier of the target data row or Task. For data rows, the identifier must match the first column's value.
E.g., {{mychoice}}
Once the user has submitted or exited the target screen, they will be returned to the original form with their progress retained.
- Open Task - this will open a task as defined by the "Pass parameters" field below, where the Task ID for the target Task should be specified. Columns from the App Tasks data source can be referenced using {{this[column]}} syntax - e.g., {{this[2]}} will pass the 3rd column's value for the current selected row.
Note that this will only work if open tasks are present. If none are available, the data source will be empty, and the user will receive an error message when opening the form. - Open URL in App - this will load the URL specified in the "Pass parameters" field below within the app, provided the device has network connectivity. The app will be used rather than a web browser. The parameter may be static or dynamic, based on a form field reference. Pass values from fields in the form using {{dataname}} syntax -- e.g., https://www.example.com?val1={{city}}.
- Open Link in Web Browser - this will load the URL specified in the "Pass parameters" field below within the app's default web browser, provided the device has network connectivity. The parameter may be static or dynamic, based on a form field reference. Pass values from fields in the form using {{dataname}} syntax -- e.g., https://www.example.com?val1={{city}}.
- Show Address on Map - this will show a map featuring the address specified in the "Pass parameters" field below. The address can be either static text or a form field reference with {{dataname}} syntax and in standard address format - i.e., Street Address, City, State/Province, Postal Code, Country or {{address}}, {{city}}, {{state}}, {{postal}}, {{country}}.
- Show Coordinates on Map - this will show a map featuring the latitude and longitude coordinates specified in the "Pass parameters" field below. The coordinates can be either static text or a form field reference, space-separated and using the {{dataname}} syntax - e.g., -12.345678 76.54321 or {{mylocationfield}}.
- Upload Form and Print - this will submit/upload the form and print an output report based on the HTML template provided in the App Printing section within the form Settings page. The print job will be sent via the device's default printing service. Please see this article for more detail.
- Upload Form - this will submit/upload the form. This serves as an alternative to the usual navigation to the end of the form to press the Upload button there.
Layout & Styling
Field Layout
This drop-down determines how this field is shown on the screen.
- Vertical places the Title and Hint vertically above the entry field.
- Horizontal will stack the entry field to the right of the Title and Hint text.
- Horizontal (Tablets Only) will use a Vertical layout for phones and Horizontal for tablets.
Background Color
The color chosen in the hex code field here will apply to the field. The Transparent box can also be chosen instead for making this transparent instead of a solid color.
Show Inline
This checkbox option will embed the barcode scanner view directly into the page instead of showing a Scan button (which is the default). Rather than clicking a button to initiate the scan in a full-sized shot, a small camera window will appear inline within the field.
Note that only one inline barcode is supported per page or table.
Not Inline (Default) | Show Inline |
Validation & Behavior
Required
Checking this box will enforce validation against this field to make the field required, disallowing the user from progressing to the next page or submitting the form if it is left blank. If the user tries, they will be prompted with an error to return to the field and enter a value. When this validation occurs is determined by the "Validation Property" chosen on the page level; please see this article for more detail on this.
This property can also be made conditional based on a formula. To enable this, click "add condition" below the checkbox and enter a formula into the field that populates. The formula serves as the basis of the required-ness of this field.
Please see this article for more information on conditionally-required fields.
Visibility
The contents of this field will determine whether the field will be visible to the user. For more detail on visibility rules, please see this article.
Dynamic Value
This property is used to define a calculation/formula that will populate the field's value. Often this is used in conjunction with the "Read Only" property (see below) so that the field will calculate and display to the user without the possibility of manual edits. This article is recommended as a starting point for more reading on this.
Please see this article for details on the relationship between Default Value and Dynamic Value.
Read Only
If this checkbox is checked, users will be able to see the contents of the field but will be unable to make edits.
Similar to the Required property, the Read Only property also includes the ability to define a conditional formula determining whether the read-only property is enabled. Click "add condition" to define such a formula.
Custom Validation
Add your own custom formula to this property for validating text entered into this field by users. The formula is only applied when the field has an answer. Enforcement will be done according to the "Validation Property" chosen on the page level; please see this article for more detail on this.
Validation Message
The contents of this property will serve as a custom message to display to the user if their input fails validation.
Advanced Options
Default Value
The value entered in this property serves as the initial value of the field prior to manual input. Please see this article for details on the relationship between Default Value and Dynamic Value.
Bind to Data Source Column
This property allows for the binding of the contents of the field to a data source that is linked to either a choices field or data field on the form. For details, please see the screenshot below:
- The data source can be selected with this dropdown. More than one will be available if multiple data source control fields (choices fields or data fields) have been added to the form.
- The data source control field can be selected from this dropdown. More than one will be available if multiple data source control fields for the same data source have been added to the form.
- The column on the data source to be bound can be selected from this dropdown.
Data Source binding allows you to create forms that can load data from, and update data to, any given data source. This opens up amazing opportunities to have dynamic data that is updated on the move (e.g., adding contacts or clients). For more information, please see this article.
Bind to Global Value
Global Values are a local key/value store that is available to any Screen on the app. Use this property to allow the user to view and save defaults for use across the app (e.g., a default project or customer). Please see this article for more information.
Exclude from Export/Display
By default, every field is displayed on Form entries in the Data area, and is included in non-templated exports (e.g., generic pdf, CSV, spreadsheet, database connectors). Use this property to prevent this field from showing on all such displays and exports.
Is Personal Data
This indicates that data captured in this field may contain personal or sensitive data, which in turn can be anonymized when exported from the platform when then the "Anonymize Personal Data" option is checked on a form connector. Please see this article for more on this.
NOTE: Use of this option does not grant or imply additional security, protection, and privacy of data.
Target Formats
This multi-select field provides the option to improve accuracy by restricting scans to match specific formats only. By default, the barcode field will attempt to match all supported barcode formats; in some cases, this can result in inaccurate scans due to unrelated formats being matched.
The following commonly-used formats are supported and are available for individual selection here; select more than one by holding the Control key on Windows or the Command key on Mac:
1D Retail/Product Formats
- UPC-A
- UPC-E
- EAN-8
- EAN-13
1D Industrial Formats
- Code 39
- Code 93
- Code 128
- Codabar
- ITF
- RSS-14
- RSS-Expanded
2D Formats
- QR Code
- Data Matrix
- Aztec (beta)
- PDF 417 (beta)
Improving Scan Speed and Accuracy
Compared to a dedicated barcode scanner peripheral, scanning with a phone or tablet camera will always be a little slower. We provide two key options on the Barcode field that can help you improve the speed and accuracy of scans.
- Supported Format
By default, the Barcode field tries to match scanned images against all supported barcode formats. Most of the time this works well; however, if your codes are small, short, or clustered next to other unrelated barcodes, then scanning can become inaccurate. The Supported Format option on the Barcode field lets you specify the exact barcode format(s) to scan for, thus ensuring that the app only scans for your target code(s), thus reducing inaccurate scans. - ITF Minimum Length
We also provide the ability to adjust the default minimum length of barcode values. This allows support for short 4-digit ITF barcodes as well as improving scan accuracy if you are targeting specific barcode digit lengths. The more specific you can be in terms of expected length, the better and faster the app can scan.
Bulk Scanning (External Barcode Scanners)
Our platform supports external barcode scanners, which is seen as more efficient than utilizing a mobile phone or tablet. The built-in bulk scanning function within our platform allows for the scanning of barcodes at an increased speed, simply set the Barcode Field's Scan Device property to External Barcode Reader.
Successfully tested on a 45,223-row database combined with a Choices Field and a simplified filter formula.
Example
A form build using a repeatable table that allows for a new repeat to be captured after a successful barcode capture.
- Add a Table field or Repeatable page
- Add a Barcode field into the Table field or on a Repeatable page
- Configure the Barcode field's Scan Device and On Scan Action properties
Scan Device - External Barcode Reader
On Scan Action - Jump To Form Location
Target for Interaction - Add New Repeat/Row
Always Jump to New Repeat - Ticked
Maximizing the value from this feature
To maximize the value you can get from this feature, we recommend configuring your external barcode scanner to send in a keyboard "ENTER" or "DONE" keypress event after every successful scan.
By doing so, the On Scan Action configured on your barcode field will instantly trigger after every scan without needing you to interact with the app! This means you can focus on scanning while the app handles everything else automatically.
If you are using a Zebra barcode scanner then you can follow this guide to configure your scanner to send a keyboard "ENTER" keypress event after every successful scan:
More information on Capturing Repeatable Data might be of interest.