Configuring the Progress Bar Widget in Progressive Web Applications - Documentation for Ar System 21.3

The following video (3:37) describes how to configure and use the progress bar widget:

The following image shows the Progress bar widget:

Before you begin

• To configure a Progress bar widget, you must have a minimum of six columns selected from a table.
• You must define the mappings for all columns.
• You can't define a duplicate mapping.

To configure the Progress bar widget

1. On the progressive view of a form, double-click a Table field.
2. On the Properties panel, under the Display property group, for the Display Type property, select the Progress Bar View value.
3. In the Value column for the Tree/Table Property property, click the ellipsis button.
   The Tree/Table Property dialog box is displayed.

4. Perform the following steps:
   1. In the Form Name box, add any form from where you want to fetch the data in the table.
   2. In the Qualification box, add a condition as per your requirement.
   3. Add the minimum required six columns for the mappings.
      You can add any additional columns, if required.
   4. Click OK.
5. Click a column in the table.

6. On the Properties panel, under the Display property group, in the Progressbar Field property, define the required mappings such as title, status, and instance ID.

7. Double-click the Table field.

8. (Optional) On the Properties panel, under the Display property group, for the Mapping Identifier property, enter a value.
   If you don't specify any value, the default colors are displayed on a Progress bar. To learn how to define a color for the Progress bar, see AR System Progress Bar Widget Mapping form.