Autocomplete Field

   MaestroThe UI design product.  |   Form Builder |  All versions This feature is related to all versions.

Maestro comes with the Autocomplete Field component, which allows you to create fields that auto-complete user's input text as they are entering it, for example, a client's address.

Usage

  1. Open the Palette pane in the Maestro Editor.
  2. Locate the Autocomplete Field component within the Input Fields folder.
  3. Drag the component into the View pane or the Wireframe.
  4. Configure the component's properties via the Properties pane.

Properties

The following properties are available to the Autocomplete Field component:

Accessibility

Placeholder Text
Text
placeholder

Include Button Next To Label
Boolean
includeButton

Descriptive Text
Rich Text
descriptiveText

This text will be used in an aria described by on the input

No Results Message
Text
noResultsFoundMsg

This text will be alerted to the user if 0 results are found

No Results Message Part 2
Text
noResultsFoundMsgIfExtra

This text will be concatenated to the No Results Message if Extra Item Message is NOT blank

One Result Found Message
Text
oneResultFoundMsg

This text will be alerted to the user if 1 result is found

More Than One Result Found Message
Text
resultsFoundMsg

This text will be alerted to the user if more than 1 result is found

Prefix Text
Rich Text
prefixText

This text will be placed on the left of the button

Button Label
Rich Text
buttonLabel

Configuration

Clear Field When Not Matched
Boolean
clearWhenNotMatched

Min Characters To Show Suggestion
Integer
minCharTrigger

Max Items In Suggestion List
Integer
itemLimit

Continue Typing Message
Text
continueMessage

Extra Item Message
Text
extraItemMessage

Data Source

Data Source
Option
dataSource

Select the data source

The following options are available from the Data Source dropdown:

Label Value
TM Dynamic Data Service service
Reference Data (Prepop) refData
Use Transact Functions
Boolean
useTransactFunctions

Uses the Transact function call instead of legacy dynamic data calls

Reference Data Name
Field Ref
dataPath

Path to source data

Trigger Property Name
Text
triggerName

Trigger Field name in JSON Result

Suggestion List Names
Text
suggestionListNames

Names that will show on each suggestion list item

Dds Configuration

First Service Name
Text
DynamicDataServiceName

First Service Version
Text
serviceVersion

Response Data Key
Text
responseKey

Delay Of Triggering First DDS Call
Integer
delayDDSCall

First Input Field Map
Field Ref Map
inputFieldRefs

The fields to pass into the dynamic data call

First Response Field Map
Field Ref Map
dataResultMappings

Paths to set result data to

Second Service Version
Text
secondServiceVersion

Second Response Data Key
Text
secondResponseKey

Help Text

Popover Help Text
Help Text
helpText

Second Dds Configuration

Second Service Name
Text
secondDynamicDataServiceName

Second Input Field Mapping
Field Ref Map
secondInputFieldRefs

The fields to pass into the dynamic data call

Second Response Field Mappings
Field Ref Map
secondDataResultMappings

Paths to set result data to

Enable Progress Message
Boolean
enableProgressMsg

Check to enable loading message popup

Progress Message
Text
progressMsg

Text to display in loading message

Next, learn about the Slider component.