Overview :
This document talks about how to Display Icon Column in Interactive Report.
Technologies & Tools used:
- Oracle Apex
- HTML
Use Case :
In Oracle apex, Using display icon column, user can use the interactive report.
User can use the different methods.
This document explains how to Display Icon Column in Interactive Report
Architecture :
Following steps explains how to display icon column using interactive report in detail,
Step 1: Create an interactive report with the following query.
select DEPTNO,
DNAME,
LOCATION,
MAX_SAL,
MIN_SAL,
STATUS,
LOCATION_ID,
DECODE(NVL(STATUS, ‘N’), ‘Y’, ‘fa fa-check-circle’, ‘fa fa-times-circle’) icon,
DECODE(NVL(STATUS, ‘N’), ‘Y’, ‘green’, ‘red’) icon_color
from DEPT
I have added two more columns in the above query, one is ICON and the second is ICON_COLOR using the DECODE function.
Step 2: Now make the columns ICON and ICON_COLOR as HIDDEN for the report.
When we run this report. It shows like this
Step 3:
Goto Page designer for that report
Then click on the column RESIGNED and in the Column Formatting > HTML Expression.
Add the following HTML expression:
Save the changes and run the report. After adding the html expression in Status Column, It shows the Status as Icon. You will have the following output:
Note: If you want to include column value with icon, then use the following HTML Expressions:
To show column value with icon color:
<span class=”#ICON#” style=”color: #ICON_COLOR#”> #RESIGNED#</span>
When we run the report the status will appear like this
Without icon color:
<span class=”#ICON#” style=”color: #ICON_COLOR#”></span> #RESIGNED#
Conclusion :
In this document, We have seen how to Display Icon Column in Interactive Report.
