Typeahead Search Form Templates

Typeahead Searching is a means of performing real-time database searches as a driver types text into a form field. Imagine a database that contains four names: Sue, Paul, Aaron, and Arnold. Using a typeahead search, after a driver types the letter "o" into a form element, only Aaron and Arnold would be returned to the driver, as these are the only database items that include the letter "o". After typing a second letter, "d", only Arnold would be shown and selectable, as it is the only name that includes both an "o" and a "d". This type of search system is also known as an "autocomplete" field, or a "real-time suggestion", and allows forms to be completed more quickly by removing the need to type out text in full.

Results returned by typeahead searches can be customized to include additional information associated with the results found, such as last names, locations, IDs, tags, nicknames, emails, phone numbers, and home addresses. This gives drivers greater certainty that the result they have chosen is correct. It also allows for a degree of flexibility if data stored in the database is incorrect (for example, if the spelling of a name is incorrect, or a phone number is wrong). Using the previous example, if Arnold's last name was "Smith", typing "Arnold" could return search results of "Arnold", "Arnold Smith", and "Arnold Smith (arnold.smith@acme.com)". These results can contain a mixture of database content and manually entered text content, making the formatting of results virtually unlimited and especially useful when dealing with very large databases.

The Auto-populate fields feature allows you to populate other fields in your forms automatically, using information associated with the result from a single text field entry. If the database included more information about Arnold and Aaron, other fields in the form could automatically populate with this information. For example, other form fields could be populated with the surname, home address, email address, and employee number paired with the result from the typeahead search field. Using this feature, drivers can automatically populate a large number of fields by typing only a handful of characters into a single typeahead field.

This forms system is extremely powerful, and can be used to expose a great deal of information about your employees, customers, and jobs in the forms that are created. Always consider the information relevant to your drivers and their jobs when generating forms to avoid any inadvertent breaches of privacy.

Adding a Typeahead Search Field to a Form Template

Adding a Typeahead Search Field to a Form Template

Adding a new Typehead Search Field is similar to adding any other form template element, as described on the Adding and Configuring Elements page. The steps required are described in detail below:

 

1.From the Tasks section of the navigation bar choose Form Templates.
2.Click Create in the upper left corner of the screen to define a new form template, or select an existing template from the list.
3.In the right Form Builder tab, click Add Form Element.

 
4.Change the Type drop-down list to Text Box. This is the only form field type that can be used with typeahead searching.
5.Type the name of the field, for example, "First Name" or "Address" into the Name field.

 
6.Click Advanced. A new control opens below the form element.

 
7.Click the Typeahead Search tab.

 
8.From the Data Source drop-down menu choose the table that contains the data you want to search within. In this example, the "Driver" option is selected. The Driver table contains information about your fleet's drivers (names, addresses, contact and license details).

 
9.From the Data Source Field drop-down menu choose the column that contains the specific values you want to search within. In this example, the "FirstName" option is selected.

 

The Data Source Field drop-down list includes the default columns found in customer databases. However, your organization may have requested one or more custom columns to meet its unique needs, such as driver certifications or preferred job site entrances.

To select a custom column and add it to the drop-down list:
 

oSelect the Select custom column option. A pop-up opens.

 
oType the name of a custom column into the Field name field.
oClick Check to validate the column name. A validation dialog box opens that indicates if the column has been found in the selected table.

 
oClick Close, then click the OK button to use the entered column name. The custom column name is added to the Data Source Field drop-down list.

 
Three new sections are displayed: Search Fields, Display Results and Auto-populate Fields.

 
Refer to the following sections for guidance on how to use the Search Fields, Display Results, and Auto-populate Fields sections when you add a typeahead search field.

Search Fields

The Search Fields section defines which other fields, if any, on the form are used to filter results, in addition to the text entered in the typeahead field. The first item shown in this section is always the existing typeahead text field and the Data Source Field that this form element searches within (configured using the Data Source and Data Source Field drop-down). This cannot be edited or removed. Click Add Field to add other form elements to use for further filtering the results retrieved from the typeahead field search.

The Add Field button is only enabled if there are additional text box form elements available in the form template (added by clicking Add Form Template) that have not already been configured as search field filters.

Imagine your new form template has two fields: one named "First Name" that filters on first names, and one named "Last Name" that filters on surnames. If a driver has already entered a last name into the "Last Name" field, this information could be used to filter the "FirstName" column to include only results with a surname that matches the text that the driver has already entered in the "Last Name" field. Without this additional search filter, searching for the first name "John" would retrieve every entry with the name "John" in the database. If the "Last Name" field already contains "Smith", and this field is used as an additional search filter, then the driver is only shown entries that include "John" and  "Smith".

To add a new search field to filter the results from your typeahead field:
 

1.Click Add Form Element to add a new form element.

 
2.Select the Text Box type for the new form field then enter a name for your new form field in the Name text field. Note that the Add field button is enabled once an additional form element has been added (Step 1).

 
 
3.Click Add Field in the Search Fields section.

Two drop-down menus are displayed below the existing typeahead field in the Search Fields section.
 

4.Open the drop-down menu on the left and select the name of the form field you created in Step 2: "Last Name" in this example.

 
5.Open the drop-down menu on the right and select a data source that the new text field will filter. Only columns that are available in the Data Source table chosen for the typeahead search field are listed.

 
6.Click Save. The added search filter form element is now used to provide additional filtering on any text entered into the parent typeahead field.
Display Results

The Display Results section specifies how the results returned by a typeahead search are displayed to the driver completing the form on their mobile device. For example, if a driver is searching for a first name, it is helpful to include additional information to ensure that the name found is the one they need. Including the last name, email address, or location in the search result can give the driver certainty that the result they see is the correct one.

Using the example above of a "First Name" field associated with the FirstName database column, if result formatting is not included, searching for "John" may result in the return of several identical-looking results of "John". Without additional information, the simple results returned by the typeahead search give the driver too many choices, so additional information needs to be added to the results.

To do this, click Add Text and enter a single space. Then click Add Field and select "Surname" from the drop-down list (available from the Driver table). If you save the form at this point, results are presented in the format of [first name][space][last name]; for example, "John Smith".

If another text field is added, with the text " (email address:", followed by a form field EmailAddress, and a final text field with a closed bracket ")", search results are then presented in the format of [first name][space][last name][ (email address:][email][)]. Results when searching for the name "John", and finding the result "John Smith", are then returned with a format similar to the following: "John Smith (john.smith@company.com)".

To add a data field to the results returned during a typeahead search:
 

1.Click Edit in the Display Results section to expand the section.

 
2.Click Add field. A field is displayed above the Add field button.

 
3.Click the down arrow on the field to open the drop-down menu. Select the column whose value you want to display in search results.

 
4.Repeat from Step 2 to add more fields, or complete the following procedure to add text or spaces between fields. Combine as many fields and results as needed to format the results.
5.Click Save once you have finished formatting the search results.

To add text to the results returned during a typeahead search:
 

1.Click Edit in the Display Results section to expand the section.

 
2.Click Add text. A text field is displayed above the Add text button.

 
3.Enter text (including spaces or characters) in the text field. As you type, the text is added to the preview field beside the Edit button. Note that you cannot edit text in the preview field.

 
4.Repeat from Step 2 to add more fields, or see the procedure above to add a data field to the results. Combine as many fields and results as needed to format the results.
5.Click Save once you have finished formatting the search results.

In the following screenshot, the result has the following format: [first name][space][last name][ (email address:][email][)]:

When a driver uses their mobile device to search for a first name using the single-field form template described above, the results have the following appearance:

Auto-populate Fields

The Auto-populate Fields section lets you configure the automatic population of elements in a form based on the results of a single typeahead search result. For example, if your form includes three fields, "First Name", "Last Name", and "Email Address" form elements, each of these could be configured to automatically populate the other two elements, using the results of one typeahead search.

To auto-populate one or more fields in your form template:
 

1.Click Add Form Element as many times as required to add more form elements. In this example, two elements, "Last Name" and "Email Address", are added below the existing "First Name" field.

 
 
2.Select the Text Box type for the new form elements then enter a name for your new form field in the Name text field. Note that the Add field button is enabled once an additional form element has been added (Step 1).

 
3.Click Add Field in the Auto-populate Fields section. Two drop-down menus are displayed below the existing typeahead field in the Auto-populate Fields section. Click Add Field for each new auto-populated form field you want to use.

 
4.Open the drop-down menu on the left and select the name of the first form element you created in Step 2: "Last Name" in this example.

 
5.Open the drop-down menu on the right and select a data source that the chosen text field will be populated from. Only columns that are available in the Data Source table chosen for the typeahead search field are listed.

 
6.Repeat Steps 4 and 5 for each auto-populated element in your form template.
7.Click Save. The "Last Name" and "Email Address" form elements will now be completed automatically when a driver selects a result from the "First Name" typeahead form field.