pavlos
pavlos

pavlos

View Profile
  • 0
Guru
Asked: 2020-11-28T15:54:25+05:30

How to highlight row based on condition using Classic Report

  • 0

Hi!

I use nested report with two Classic Reports, how can I use highlight based on column value for both?.

Thanks in advance!

oracle apex

14 Answers

  1. afzal

    afzal

    • India
    View Profile
    Guru

    step -1
    give class name for your report like-- emp
    at report region , appearance section "CSS Classes" => emp

    step -2
    create a dynamic action at page load
    action == execute javascript code
    like--
    //-- replace your conditional column with "DEPTNO", AND ALSO REPLACE TEXT =='10' WITH YOUR CONTENT
    $('.emp [headers=DEPTNO]').each(function(){
    console.log($(this).text());
    var text=$(this).text();
    if (text == '10'){
    $(this).closest("tr").children().css({"background-color":"red"});
    }
    });

    • 1
  3. pavlos

    pavlos

    View Profile
    Guru
    This answer was edited.

    Hi!

    How can I compare date column with JavaScript?
    I want to change row color where date is less than current date.

    • 0
  4. afzal

    afzal

    • India
    View Profile
    Guru

    step 1---
    report query like--
    select EMPNO,
    ENAME,
    JOB,
    MGR,
    HIREDATE,
    SAL,
    COMM,
    DEPTNO,
    to_date(to_char(sysdate,'dd-mm-yyyy'),'dd-mm-yyyy')-to_date(to_char(HIREDATE,'dd-mm-yyyy'),'dd-mm-yyyy') as dummy
    from EBA_DEMO_CHART_EMP
    step-2 column-name-- HIREDATE
    KEEP HTML EXPRESSION LIKE -- <span data-id=#DUMMY#>#HIREDATE#</span>
    step-3 make dummy column as hidden column

    step-4
    give class name for your report like– emp
    at report region , appearance section “CSS Classes” => emp

    step-5
    create a dynamic action at page load
    action == execute javascript code
    like–
    //– replace your conditional column with HIREDATE

    $('.emp [headers="HIREDATE"]').each(function(index,element){
    var x= element.innerHTML;
    //console.log($(element).children().attr('data-id'));
    var text= parseInt($(element).children().attr('data-id'));

    if (text > 1){
    $(this).closest("tr").children().css({"background-color":"red"});
    }
    });

    • 1
  5. goto150

    goto150

    • Wroclaw, Poland
    View Profile
    Professional
    This answer was edited.

    It's going to be a variation of the above:

    1. Click on HIREDATE column name
      1. Column Formatting
        1. HTML Expression = <span name="nHIREDATE">#HIREDATE#</span>
    2. In Dynamic Action tab right click on Events --> Create Dynamic Action
      1. Identification
        1. Name = Set style on refresh
      2. When
        1. Event = After Refresh
        2. Selection Type = Region
        3. Region = /your region name/
    3. True Action
        1. Identification
          1. Action = Execute Java Script Code
        2. Settings --> Code:
    var cell_hiredate = document.getElementsByName("nHIREDATE");
cell_hiredate.forEach(function(row){
//I use "9/28/1981" to get some variety for the test case, you will use Date()...
if (Date.parse(row.innerText.toString()) > Date.parse("9/28/1981")){
//.parentElement.parentElement. to get you at the row level
//.parentElement. single parrent will get you at the cell level 
row.parentElement.parentElement.style.setProperty("background-color", "#daf0ba"); 
}
}
);
    1. Fire on Initialization = TRUE if you want the action to fire when the page loads
    • 2

You must login to can add an answer.