Sun. Oct 24th, 2021

Requirement: I have an EMP data displayed in an Interactive Report in Oracle APEX as shown below:

Now, my requirement is to highlight all those rows as yellow and also the color of the text as red, where the SALARY is less than or equal to 14500, as shown below:

Environment Setup: Let us first create an EMP table by using the below CREATE Table statement.

CREATE TABLE emp (
    emp_id  NUMBER PRIMARY KEY,
    name    VARCHAR2(20),
    salary  NUMBER
);

Insert few records using the below INSERT statements:

INSERT INTO emp(emp_id,name,salary) VALUES(1,'Susanto',10000);
INSERT INTO emp(emp_id,name,salary) VALUES(2,'Moumita',20000);
INSERT INTO emp(emp_id,name,salary) VALUES(3,'Shivansh',15000);
INSERT INTO emp(emp_id,name,salary) VALUES(4,'Anjali',13000);
INSERT INTO emp(emp_id,name,salary) VALUES(5,'Shuhansh',14500);
INSERT INTO emp(emp_id,name,salary) VALUES(6,'Subrata',15600);

Solution: For solution of the above requirement follow the steps as shown below:

Step 1: We will assume that we already have the Interactive Report displaying the EMP data created. Now, when we ran the application, we will have the EMP Interactive Report displayed as shown below:

Step 2: Click on the Actions > Format > Highlight

The following dialog will open, then specify the condition and settings according to your requirement.

Here, we will provide the values a shown below:

  • The Name as Salary Check
  • Select the Highlight Drop Down as Row
  • Set Background Color as Yellow (#FFFF99)
  • Set the Text Color as Red (#FF7755)
  • Select the Condition Type as Column
  • Select the Column as Salary
  • Select the Operator as less than or equals
  • Set the Value as 14500

Then, click on the Save button.

Step 3: As soon as we clicked on the Save button we can see, that all the rows where the Salary value is less than or equals to 14500 are highlighted in Yellow and also the Text Color for those rows are in Red.

One more extra thing we can see is the condition name displayed with a Star icon, and a close button as highlighted above with a red box. When we clicked on the Close button the Report Highlight Condition will also get removed.

Step 4: Now, if we do not want to show the Report Highlight Condition box above the report, we can use a CSS tricks. For that, let us go to the Interactive Grid in the APEX Developer instance (APEX Page Designer) > Select the Report (Highlight Rows Conditionally) > Set Static ID as empDetail > Click Save

Step 5: Now, add the below CSS code in the Inline CSS Section of the Page.

#empDetail_ig_report_settings{
    display: none;
}

Now, our report will be displayed without the Report Highlight Condition box, as shown below.

Now, this Report with all the Row Highlighting is only visible to the Developer. To make this Interactive Report changes permanent and visible to every users, we need to Save this Report for which we have to Click on Action Menu > Report > Save

Hence, the solution to our requirement.

If you like the post please comment, share, and do join me on Facebook. Please subscribe to my YouTube Channel for video tutorials.

Thanks & Regards,
Susanto Paul

 2,862 total views,  13 views today

By Susanto Paul

Susanto is an Oracle ACE, a qualified MCA, MBA, and a highly-skilled Senior Oracle Specialist. He is an enthusiastic Blogger and YouTuber who helps learners to solve their complex problems more efficiently. He has 9+ years of experience in multiple technologies like AWS, Oracle ADF, Oracle APEX, Oracle JET, Oracle VBCS, Oracle IDCS, Oracle PL/SQL, Oracle Integration Cloud, Java, JDBC, Servlets, JSP, Spring, Hibernate, HTML5, CSS3, JavaScript, TypeScript, NodesJS, Angular, MySQL, Oracle WebLogic Server, JUnit, JMeter, Selenium Web Driver, etc. He is a certified: Oracle Certified Professional Java SE 6 Programmer, Oracle ADF 11g Certified Implementation Specialist, Oracle Cloud Platform Application Integration 2020 Certified Specialist, Oracle Cloud Infrastructure Foundations 2020 Certified Associate, and Oracle Cloud Infrastructure Developer 2020 Certified Associate

Leave a Reply

Your email address will not be published. Required fields are marked *

satta king chart