Using conditional classes in grids

Introduction

In many scenarios the end user wants to highlight rows in a grid based on a series of criteria. The user's objective is to be able to scan the grid quickly and find rows matching those criteria.

ConditionalClasses
Row-level and cell-level conditional classes. Rows with a Price greater or equal than 1000 are highlighted in red, while those between 600 and 999 are highlighted in orange

To configure this, the developer has to specify two things:

  1. The conditions that have to be met for a row to be highlighted.
  2. The style that will be applied to highlighted rows.

Note that in a grid many conditions may apply, each with a different style for the highlighted column. Also, the style can be applied to the entire row, or to a specific column.

How to implement conditional classes

In order to use this feature, the developer can use the "Conditional Row Classes" and the "Conditional Cell Classes" properties. The first property configures the conditional classes for an entire row, and is located in Grid (WPD) or Grid Columns (Patterns) nodes. The second one is available in Attribute (grid) and Variable (grid) nodes and applies to the corresponding column only.

Both properties can be edited using a custom editor, shown below.

ConditionalClassesEditor
Conditional Classes Editor

As seen in the editor, the developer may specify any number conditions and associate each condition to a Theme Class.

The Theme Classes available for this editor are the ones defined in the "Available Conditional Classes" property in K2BWebPanelDesignerSettings and K2BToolsPatterns General Settings.

The conditions may involve any attribute or variable included in the grid. If the grid contains SDT variables, the CurrentItem property may be used to define the condition (for example, "&GridInvoiceSDT_SDT.CurrentItem.InvoiceTotal > 1000" is a valid condition).

Runtime evaluation

When loading the grid the conditions will be evaluated in the order in which they appear in the property. The row will be assigned the class associated with the first condition matched by the row (the rest will be ignored).

If a column contains conditional classes conditions, those conditions are evaluated before the ones found at a grid level. If no column-level conditions match, the ones defined at the Grid level are evaluated.