Compact forms in WEBCON BPS 2020

Applies to version 2020.1.3; author: Michał Kastelik

WEBCON BPS compact forms adapt the application's main form to work on mobile devices and small screens. The compact appearance may differ from the main form in the layout, order of the fields, and other aspects. When you create an application with the main form on the WEBCON BPS platform, the system automatically creates its compact version. It can be used after pressing the Save button.

WEBCON BPS 2020 uses compact forms on mobile devices and in the element preview window.

This article describes compact forms and how to customize them.

What is a form?

On the WEBCON BPS platform, a form is a representation of one of the workflows in the process at a given step of the workflow. A form is made up of its configuration, the form fields displayed on it, and their settings. The form fields are organized in order and position (top, left, right, bottom) that is set on the graphical representation of the form. They have their visibility and editability settings, as well as other configuration options. 
 

The configuration of the form consists of 1) form rules that are executed when the form is displayed, 2) visibility settings for the top bar buttons, 3) editing mode, 4) attachment settings, 5) and accessibility settings for transition paths.

Creating a new form configuration

The WEBCON BPS platform builds a compact form by default. When you create the main form, a compact form is automatically built. In most cases, this solution is enough. However, the business may want to adapt the ergonomics of the compact form to its needs.

To customize the form, expand the Workflows branch and select "Compact form".

Then, in the "Global form template" tab, click the "Break settings inheritance" button. 

After confirmation, the form's configuration screen will go into editing mode.

At any time, you can undo the changes you made by pressing the "Restore settings inheritance" button. If you do so, the form definition will be restored to the default settings, and the changes will disappear.

What is inheritance?

Each workflow has a main form and its compact version. The same is true for every step in the workflow. Now, let us explain how inheritance works here.

The form fields groups' order is passed from the form fields tree to the main form of the workflow. Because of that, when you open the Global Form Template, you will see that the form fields groups are ordered in the same way as in the form fields tree. As long as the inheritance is not broken, changing the order of the form fields in a group (or tab) will change the order of these form fields on the inheriting workflow form and vice versa.

Moving on, the main step forms inherit field order and a few other settings from the workflow's global form template. The compact global form template inherits settings from the main global form template. Logically, a compact step form inherits from its main form version.

If we break inheritance for a compact workflow form, it will become independent of the workflow's main form. This way, compact step forms will also become independent of the main form steps.  In this case, field visibility is set independently for compact forms, while the field layout on the compact step forms corresponds to the order of the fields on the compact workflow form.

It is also possible to break the inheritance for a compact step form. This allows us to change the fields' layout and settings at a given step without inheriting them from any form. However, we cannot break inheritance between a form we have added manually on a given step (i.e., a non-default step form) and its default form.

Warning: the changes made on the compact workflow form or on a compact step form will not be introduced into the WEBCON BPS system database unless you have previously broken the inheritance for the given form. 

Modifying a compact form

The compact form has the same configuration options as the main form. In its individual tabs, we can define its appearance and behavior.

Tab: Global form template

There is only one form field zone in a compact form. We can change the order of individual form fields or their groups, but there are no zones (top, bottom, right). The form fields defined on the left side of the "Main Form" are displayed first. Look at the "Ticket details" group on the form below.

When we open an item preview, we cannot see the user report's details on the first screen. The ergonomics of this form can be improved. To do so, we will drag and drop the "Ticket details" group higher.  

After saving the changes, the effect is as follows.

On the left side of the tab "Global form template" there are buttons:

• Full-screen mode - starts the full-screen mode in WEBCON BPS Designer Studio. The current form configuration tab will fill the entire screen. To exit the full-screen mode, press the button again or press the Esc button.
   

• Form preview - runs the built-in form preview in the default web browser in the system. The preview allows you to interact with the compact form and check the changes that have been made.

• Break / Restore Settings Inheritance - allows you to break or restore inheritance of compact form settings

Tab: Field Matrix

Open the tab Field Matrix of the compact form. Go to the tab Form Fields to change form fields visibility. To define which areas should appear on the form and which should not open the Standard areas tab.

We can customize the form's appearance in these areas:

• Status panel - here, you can hide individual panel elements, such as the sub-workflow view or the process supervisor,
• Form menu - here, you can hide menu buttons such as Save / Refresh and others.

When you save the changes, they will be visible on the compact form wherever it appears. This includes the element preview in the web browser and WEBCON BPS mobile applications.

Tab: Behavior

Here you can specify an override for a form rule that will be run each time a compact form page is loaded. Script override only works between the main form and the compact form. The script from the main form of a given step may be overwritten by the script of the compact form of the given step.

Each of the scripts can be overwritten without breaking the form's inheritance.  You can also disable the scripts on the compact form by selecting the "overwrite" option and leaving the field with the script blank. However, it is not possible to define other scripts for non-default forms.

The compact form configuration can also be changed by opening the configuration of a given step in the workflow. After opening the step configuration, go to the tab "Forms in current step" and then select "Compact form". In one tab, we can create a whole new form configuration.

You can overwrite the main form script only for a given step of the compact form if you want. It is done in this window, in the tab "Compact form - Behavior". To do this, just like in the case of overwriting global form scripts, press the "Overwrite rule from the main form" button and then paste the script you want to execute.

If the global script for page load was defined in the application configuration, it would be executed first; then, the script for the given step's page load will be executed.

More information on the script execution order in WEBCON BPS can be found in this article: Form rules – Execution order – WEBCON BPS Knowledge Base

Summary

Compact forms let the user fully use the WEBCON BPS platform on mobile devices, either with mobile browsers or WEBCON BPS mobile applications for iOS and Android. Additionally, they provide quick and easy-to-read access to the data stored in the forms when displaying an element preview window in a desktop browser.