how to insert and display true and false icon in apex?

Question

i have a form and report pages, i want to insert a true mark and a false mark in some items i am using oracle sql and plsql how can i do that? the output must be like in the picture

Answer 1

For a classic report and an interactive report, you can use "Column Formatting > HTML Expression" and then format the column according to your needs. The easiest is to use the success/danger color class provided by APEX for your theme. APEX also has its own font set based on "font awesome" called "font APEX". Both can be seamlessly integrated in your report.

For this example I used the sample EMP/DEPT tables.

Classic Report AND Interactive Report

• Source Query:

select EMPNO,
       ENAME,
       JOB,
       CASE WHEN job = 'PRESIDENT' THEN 'fa-check' ELSE 'fa-remove' END as icon_class,
       CASE WHEN job = 'PRESIDENT' THEN 'u-success-text' ELSE 'u-danger-text' END as color_class
  from EMP
 where  job in ('MANAGER','PRESIDENT')

• Set columns color_class and color_icon to hidden
• set BOSS column html expression to <span aria-hidden="true" class="fa #ICON_CLASS# #COLOR_CLASS#"></span>

Interactive Grid

• Source Query:

select EMPNO,
       ENAME,
       JOB,
       CASE WHEN job = 'PRESIDENT' THEN 'fa-check' ELSE 'fa-remove' END as icon_class,
       CASE WHEN job = 'PRESIDENT' THEN 'u-success-text' ELSE 'u-danger-text' END as color_class
  from EMP
 where  job in ('MANAGER','PRESIDENT')

• Set columns color_class and color_icon to hidden
• IG does not support HTML Expression like the other reports, but similar layout can be achieved using "Column > Advanced > Column Initialization JavaScript Function".

function(config) {
    config.defaultGridColumnOptions = {
        cellTemplate: '<span aria-hidden="true" class="fa &ICON_CLASS. &COLOR_CLASS."></span>'
    };
    return config;
}

Note that the syntax is the &COLUMN_NAME. notation in the IG.

• Result: