Hide column conditionally in Pega table

If there is a requirement where a column in a table should be hid based on a condition then the below approach is one of the solutions.

A table with three columns

In the above picture, the third column (Hide on Condition) gets hidden at run time when a condition is met. Following below steps will achieve that result.

1. Create a table and for the column to be hidden, provide a data-tour-id as ‘hide-col’ for both header and data cell.

Tour ID as hide-col in header cell properties

Tour ID as hide-col in data cell properties

2. Create a HTML fragment rule(Rule-HTML-Fragment) called HideTableColumn and insert below code.

Code to get all elements with matching data-tour-id and set style on each to display:none;

3. Create another HTML fragment rule(Rule-HTML-Fragment) called HideTableColumnConditionally and insert below code.

Including first fragment rule in between pega:when tags

4. Include HideTableColumnConditionally fragment rule in the table header (one of the cells) using pega:include jsp tag.

<pega:include name=”HideTableColumnConditionally” type=”Rule-HTML-Fragment”/>

Insert HideTableColumnConditionally fragment into table header cell using pega:include jsp tab

5. Make sure the when condition rule is in a class that is in inheritance hierarchy.

6. Because the main fragment rule is inserted in table header cell, it applies to all pages (if there is pagination).

7. Test it out and make changes as per your application use case.

Be vigilant to use this approach if there is huge result set (over 10000 records) in single page. Also, change When condition and other rule names accordingly to your application standards.

Let me know if this approach worked for your use case and appreciate if you post any other approaches to hide column conditionally.