UiPath Activities

The UiPath Activities Guide

About the Form Activities Pack

The Form activities enable you to create custom input forms which can be used to collect data from human users, or display custom callout messages, which can detail different parts of your attended automation.

Release Notes

Note:

The Forms activities pack uses the Form.io engine. To find out more about our product, you can view their official documentation.

Real Time Forms

The Real Time Forms feature enables you to modify values in the form you are using without closing the form. This means variables linked to the form fields you are using can be easily modified without needing to close the workflow and then run it again. In order to do this, the Create Form activity contains a Do container which can hold activities that are tailored to this end. Fields and buttons in the Form can be configured to be linked to activities in that Do block.

Let's choose, for this example, a simple form that has two fields: Username and City. To do this, we can simply create two new In/Out arguments in the FormFieldsCollection property of the Create Form activity.

To make use of this feature, you can create buttons in the form that do not close the form once they are clicked. To do this, once a new button is created, you must switch to the Field Key configuration tab and add a new Key called closeOnSubmit and set its Value to false. For this example, we will create a button called Update. The .gif below explains this process:

Once this button is created, you can use activities such as If to change values in real-time in the form or the database behind the form. First, whatever button is clicked while the form is open must be stored in a variable, and to do this, we use the SelectedButton property field and create a variable in it, called btn.

To use form-specific buttons in the If activity, you can reference them by using the btn = "" expression. For example, if we wanted to monitor the Update button in the form, we would insert the btn = "Update" expression in the Condition field of the If activity.

Then we can start creating rules for this condition. For example, once the Update button is clicked, we want to display Database Updated in the Username field. To do this, we can use an Assign activity in the Then section of the If activity:

Running the form now enables you to make changes in real-time, without having to close the form and subsequently reopen it.

Using Real Time Forms

Activities in the Do block will execute activities against the fields of the Form - both reading and writing data. These activities are triggered any time a button is clicked or, optionally, when the form is opened. While activities are being executed, the Form will remain open and editable for the end-user.

Triggering the Do Loop

Buttons are the key to triggering the activities in the Do block of the form. By default, a button will trigger the Do loop and then close the form. To trigger the Do loop and then keep the form open with refreshed values, you must add the following custom property to the Field Key tab on a button: (closeOnSubmit, False).

You can see which button has been pressed on a form by parsing the SelectedButton field in the output.

Update Form Values

Values on the form can be updated by changing the corresponding variables within the Do loop.

Form Data Binding

Forms are complex data manipulation environments that are built by joining multiple components in the Form Designer. The following components are available in the UiPath ecosystem:

Basic
Advanced
Layout
Data

Text Field

HTML Element

Columns

Container

Text Area

Content

Panel

Data Grid

Number

Email

Table

Edit Grid

Password

Phone Number

Tabs

Checkbox

Date/Time

Select Boxes

Day

Label/Header

Time

Drop-Down List

Currency

Radio

Survey

Button

These components can be binded to workflow variables, thus easily creating dynamic forms. There are two ways to bind form fields to variables:

  • Using the FormFieldsCollection property field - This field can be used to bind workflow variables into a form by entering them as field keys in the Form Designer. They can have a direction specified as IN, IN/OUT, OUT. Variables in this field also contain form output when the direction is set to IN/OUT or OUT. This field supports only Dictionary<String,Argument> objects.
  • Using the FormFieldsInputData property field - This field can be used to pass JSON input data to the form. This field supports only valid JSON as strings or String variables.

Important!

These two methods are mutually exclusive, meaning that if one is used, the other one is ignored, and you cannot use both at the same time.

Dynamic Check Boxes

Dynamic check boxes enable you to view an entire list of data entries and select one or more, according to your use case. In order to use this feature, you must begin by creating a list or a dictionary of strings containing the data you want to use. For this example, we use a list of strings, stored in a list<string> object named doc:

doc = new List<string>();
doc.Add("Choice1")
doc.Add("Choice2")
doc.Add("Choice3")
doc.Add("Choice4")

Once the data is stored in the doc variable, we must add it to the FormFieldsCollection property field of the Create Form activity as an argument so it appears in the form. The form determines automatically that it is dealing with a set of dynamic check boxes and displays them accordingly. These check boxes can then be edited like normal ones from the Form Designer, selecting the number of minimum or maximum choices a user can make when working with them.

Conditional Drop-Downs

Conditional drop-downs enable you to pick a dataset that is being displayed in the form based on the choice made in another element of the form. For example, it enables you to select a specific country from a drop-down and display the states in that country.

In order to use this kind of drop-downs, you must create a parent drop-down, which is of the type list<string> or dictionary<string, string> and a child drop-down, which is of the type dictionary<string, list<string>> or dictionary<string, dictionary<string, string>>

Displaying a Default Tab

When working with a form that uses multiple Tabs, you can specify a tab to be displayed by default upon opening the form.

In order to do this, you must click the Edit button of the tab you want displayed by default and navigate to the Field Key configuration tab. Next, add a new Custom Property by using the Add Another button, and modify the parameter in the Key field to defaultTab and the parameter in the Value field to a number representing the tab you want to open by default.

Important!

The first tab in the form is represented by the number 0 in the Value field, and all subsequent fields increment this number.

If we had a total of 5 tabs, to specify the first tab we would have to use 0 in the Value field, to specify the second one, we would have to use 1, and so on until the fifth tab, where we would have to use 4.

For example if we have a form that contains 3 tabs and we want to make the third tab be open by default, a new Custom Property must be created with the Key set to defaultTab and the Value to 2.

Note:

Please note that only static values can be used for the Value field.

Displaying Images in Forms

You can display images in your forms, both local image files as well as Base64 encoded images.

Local Image File

To upload local image files in your forms, you must simply use the Content form element and use its Insert Image functionality, which prompts you to browse for the image file you want to use.

HTML Element Local Image File

You can use the HTML Element form component to display a local image in your forms. To do this, you must add the following code in the Content section of the form component: <img src="/file://path-to-file" />, where path-to-file is the path to the file you want to display.

If, for example, the path you want to use is c:\folder\image.jpg, the code you have to use looks like:

<img src="/file://c:\folder\image.jpg" />

Base64 Encoded Image

You can also use a HTML Element form component configured to contain an image converted into Base64. If, for example, the image you want to use, converted to Base64, is stored in a variable called img, you have to enter the following code in the Content section of the component:

<img src="{{img}}" />

Note:

Using this method enables you to change the image dynamically.

Displaying PDF Files in Forms

You can display the contents of a PDF file by using the HTML Element form component. To do this, you must add the following code in the Content section of the form component: <iframe src="/file://path-to-file" />, where path-to-file is the path to the file you want to read.

If, for example, the path you want to use is c:\folder\doc.pdf, the code you have to use looks like:

<iframe src="/file://c:\folder\doc.pdf" />

You can set the height and width of the pdf by simply adding width-value height-value to the code, where value is the size you want to use.

Updated about a month ago


About the Form Activities Pack


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.