Skip to end of banner
Go to start of banner

Autocomplete Control

Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 12 Next »

An "autocomplete control" is a user interface element, often used in forms or applications, that provides suggestions or completions for user input as they type. The control predicts the rest of a word or phrase based on the characters entered by the user, offering a list of suggestions that match the input.

This control is commonly used to enhance user experience, reduce errors, and speed up data entry. Using Autocomplete controls users can benefit from predictive suggestions.

There are basically three steps to create an autocomplete control on the form:

  • Create a Datasource.

  • Bind your Datasource with a control.

  • Set the properties and perform the configurations for the autocomplete control.

Steps to create an autocomplete control on the form to assist users in finding a person in EmpowerID.

  1. On your Form Add an object of type String.

  1. Double-click on it, rename it, and assign any name. In our case, I am naming it FirstName.

  2. Drag and drop FirstName onto the Form Designer

  1. Right-click on the Data Sources, select the Add Data Source option. The Add New Data Source dialog box will appear. Keep the first option selected and click on the Next button.

  1. Give your Data Source a name, for example, dsPerson. Select Generated as your Data Source Type. From the Component Name, choose PersonSearch, and from the Method To Execute, select GetSearch (string textToSearch). Finally, click on the Finish button.

  2. Right-click on the FirstName field and select the Edit option. Then, go to the DataSources tab and choose your newly created datasource (dsPerson).

  1. Navigate to the Control Types tab and select the AutoComplete control.

  2. Now, go to the Standard Properties tab and set the properties as follows:

  • Display Field: FriendlyName

  • Selected Value Path: PersonID

  • Item Template Name:

  • Search Parameter Name: textToSearch

  • View One Link Type:

  • Initial Value DataSource:

  • Initial Value DataSource Display Field:

  1. Click Ok on the Field Configuration Dialog box.

  2. Save and Publish your Form and restart the Workflow Studio.

  3. Now create a Workflow and drag your form onto the Workflow Designer pane and publish your Workflow.

  4. Now publish the Form and the Workflow on the EmpowerID Web.

  5. Reset the IIS

  6. Run your workflow and see how autocomplete control appears in the UI.

Watch this video to learn more about the Autocomplete Control: /wiki/spaces/EIDNEWS/pages/2995126291

  • No labels