Applies to version: 2022 R3 and above; author: Łukasz Maciaszkiewicz

Introduction

To make item list more readable and user-friendly from 2022 R3 version WEBCON BPS introduces alternate colouring of item list rows. The solution allows for easier distinction between rows, which is especially important in the case of large item lists.

The article describes this functionality and discusses additional methods of item list customisation with an example of conditional row colouring which allows the user to colour only the rows fulfilling the user-defined condition.

Overview

Alternate colouring of item list rows is built in WEBCON BPS from 2022 R3 version. The functionality makes item list more readable by displaying alternately row colour in two shades.

The displayed colour depends on the theme set up in WEBCON BPS Portal. Here it is “WEBCON Light”.

Alternate row colouring in grey – WEBCON BPS Light theme default colour.

It is possible to change the item list colour or configure conditional row colouring. The alternate row colouring functionality runs automatically in such cases too. The latter of the mentioned options is presented below.

Conditional colouring of item list rows

By setting up a condition, the user can highlight only complying item list rows. The example below presents a configuration where items with price exceeding 1000 EUR are coloured yellow.

Case description

An application with workflow presented on the diagram below was created. The workflow includes a configured form for submitting purchase order requests. Among the form fields there is an item list field named “Purchase order list” consisting of four columns, three of which include numerical values. The form field presents items requested by the submitter. The request must be accepted by the superior and subsequently by the accountant with access to the above-mentioned item list.

Workflow used in the example.

Procedure

To set up conditional colouring of rows in yellow choose “Purchase order list” form field from the selection tree and press „Advanced configuration”.

Item list advanced configuration.

In the opened window click the “Layout” tab.

The “Layout” tab.

Check the “Use advanced appearance settings” field. Leave the colour mode field with “For whole row” value. It is now possible to type in the SQL code in the text field “SQL/CAML query that returns color”, but in the discussed case we will use the expression editor that facilitates edition. Click the ellipsis button next to the text field “SQL/CAML query that returns color”.

Enabling colour mode and setting up preferred colour.

Enter the below conditional SQL query in the text field. In the presented example the item list row will be coloured in yellow if the value in the “Price” column exceeds the 1000 EUR threshold.

if (cast('{SFD:315}' as float) > 1000)

select '#FFFE91'

The “#FFFE91” part of the query stands for a colour code. To change the colour replace it with a code of a selected colour, remembering to put it between the two apostrophes. The “{SFD:315}” refers to the “Price” column defined earlier for the item list and can be replaced with any column with numerical values. It is also possible to use the variables editor on the right to edit the query and insert respective values.

SQL expression editor.

Click “OK” button and press “Save & publish process” in the form field edition window.

Saving changes in the form.

To check how the new configuration works go to the WEBCON BPS Portal and open form including the modified item list, enter several items and submit the request. The rows complying with the condition are coloured in yellow in two shades – the system dimmed every second row. The colour of the rows not fulfilling the condition stays unaffected, but also here every second row is dimmed.

Item list with coloured items satisfying the entered condition.

Summary

Alternate row colouring makes even long lists more readable and facilitates their reviewing. The functionality is built in WEBCON BPS and runs automatically without the need for configuration.