IR row highlight colouring

In Apex 4, if I set a row highlight in an interactive report to be dark blue background with white text, the row gets highlighted correctly, but the key that appeara at the top of the report has dark blue background and black text, making it difficult to read - in apex 3.2 the key reflected the row colouring. Is there a way to change this?

Hi Lance,
This is no problem - pleae check out the user guide first. It contains many practical examples. For example the 5.5 User guide contains an example for this on page 2-43
"Conditionally Highlighting a row". Get the latest user guide, we also add more information.
A very simple way to achieve what you want to have 3 rows - how many colors you want.
Then you put an if statetement (?<if:...?> in the beginning of the first cell of each and the end statement at the end of the last cell (<?end if?>). Then the correct row will be selected for each color.
|<?if:AMOUNT=0?>| COLUMNS WITH WHITE BACKGROUND | LAST <?end if?>|
|<?if:AMOUNT>0?>| COLUMNS WITH RED BACKGROUND | LAST <?end if?>|
|<?if:AMOUNT<0?>| COLUMNS WITH GREEN BACKGROUND | LAST <?end if?>|
Hope this helps,
Klaus

Similar Messages

  • Row highlight does not work when class has a background-clolor

    This is more a CSS / javascript question but since the problem occurs in Apex I'll try my luck here.
    I try to implement a row highlight feature that worked in 3.2 but not in 4.0. The difference is that the style that is used for the table cells contains a background-color in the 4.0 template and it did not in 3.2.
    This is how it works.
    I created a report template with "before each row" : <tr onMouseOver="cOn(this);" onMouseOut="cOut(this);">
    The javascript does this:
    function cOn(td) {
       if(document.getElementById||(document.all && !(document.getElementById))) {
          if (td.previousSibling != null) {
              td.style.backgroundColor="#FFFF99";
              td.style.color="#000000";         
    }My thought was that td.style.backgroundColor="#FFFF99" would overrule the background color given by the class but when this happens from within javascript this does not work. Is this proper behaviour? Are there other methods that will work?

    Hi Rene
    If you are just looking for a row highlight on a mouse hover, it might be easier to place the following in the html header of the page:
    <style = text/css>
    .apexir_WORKSHEET_DATA tr:hover td {
    background-color: #FFFF99 !important;
    color: #000000 !important;
    </style>
    ~Andrew Schultz

  • In Pages when I go to FIND how can I change the highlight colour of the found word?  At the moment it is a very pale grey and not easily seen.

    In Pages when I go to FIND how can I change the highlight colour of the found word?  At the moment it is a very pale grey and not easily seen.

    Well, it might depend on the nationality of your keyboard, but on my US keyboard, the tilde ("squiggle") is above the TAB key; on a Mac, ⌘-TAB cycles through the active applications and ⌘-tilde cycles through the windows in the front application.
    When you do a Find, Pages selects an instance of your search text (the next one after the current selection, I think, but I didn't check that). It doesn't make the document window the front window, though. If you click in the window to bring it to the front, it moves the selection (or insertion point) to wherever you click unless you click on or above the ruler. Try clicking at the top of the document window after you do a find; say somewhere near the document name. Now you should see the highlighted selection (your search text). If you click back on the Find window, the selection will go grey again, unless you hold ⌘ down while clicking.

  • Preview Highlight Colour

    Just wondering if there is anyway to change the highlight colour in Preview from the dull grey to something that stand out more?
    Not the highlight colour when you select areas with the mouse, the highlight colour you get when using spotlight, then open the document it found, all the highlights are a dull grey, which can be quite difficult to see.
    Thanks
    Jed

    Hi Graham
    No, not that preferences, that is fine, it is when using Preview, open a pdf document and perform a search on a keyword. the found referenes to it are highlighted in grey, my normal highlight colour is red. It seems that preview has an inbuilt highlight colour that does not come from system preferences
    Regards
    Jed

  • JTable cell focus outline with row highlight

    With a JTable, when I click on a row, the row is highlighted and the cell clicked has a subtle outline showing which cell was clicked.
    I would like to do that programatically. I can highlight the row, but I have not been able to get the subtle outline on the cell. My purpose is to point the user to the row and cell where a search found a match. I do not have cell selection enabled, because I want the whole row highlighted.
    My basic code is:
    table.changeSelection(irow, icol, false, false);
    table.scrollRectToVisible(table.getCellRect(irow, icol, true));I keep thinking I just need to find a way to "set focus" to the cell so the subtle outline is displayed, but I cannot find something like that.
    Does anyone have some ideas on how to activate that automatic outline on the cell? I prefer not to write custom cell renderers for this if possible.

    That seems unnecessarily complicated, the outline is the focused cell highlight border so requesting focus on the table should be enough.
    import java.awt.BorderLayout;
    import java.awt.EventQueue;
    import java.awt.Rectangle;
    import java.awt.event.ActionEvent;
    import javax.swing.*;
    public class TestTableFocus {
        public static void main(String[] args) {
            EventQueue.invokeLater(new Runnable() {
                public void run() {
                    final JTable table = new JTable(10, 10);
                    JFrame frame = new JFrame("Test");
                    frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
                    frame.getContentPane().add(new JScrollPane(table));
                    frame.getContentPane().add(new JButton(
                      new AbstractAction("Focus cell") {
                        @Override
                        public void actionPerformed(ActionEvent e) {
                            table.changeSelection(5, 5, false, false);
                            centerCell(table, 5, 5);
                            table.requestFocusInWindow();
                        private void centerCell(JTable table, int x, int y) {
                            Rectangle visible = table.getVisibleRect();
                            Rectangle cell = table.getCellRect(x, y, true);
                            cell.grow((visible.width - cell.width) / 2,
                                    (visible.height - cell.height) / 2);
                            table.scrollRectToVisible(cell);
                    }), BorderLayout.PAGE_END);
                    frame.pack();
                    frame.setLocationRelativeTo(null);
                    frame.setVisible(true);
    }

  • Preview Highlighting colours not showing in other PDF viewing programs

    Hi,
    I'm new to OSX and today discovered that Preview can mark up PDFs with highlighted colours - pretty cool
    However when the saved PDF is viewed with other programs; Adobe Reader XI on both Windows and MAC and Foxit Reader, the highlighted colours are so faint you can easily miss them and its very hard to distingiush between yellow and green.
    Anyone else come across this?
    Thanks
    Mike

    Same problem here.

  • Keep row highlighted using jQuery

    Hello!
    I'm using the following code to highlight a row in my report, calling it via an onclick event -
    function highLight( pThis ){
     $('td').removeClass('current');
     $(pThis).parent().parent().children().addClass('current') ;
    I have an icon in the same row that opens a popup page where a user can edit that particular record. Once the changes have been made and the 'Apply changes' button is clicked, the popup window closes and the page is refreshed to show the changes, but my row highlight disappears. How can I go about keeping that row highlighted after the page has reloaded?
    Thank you!
    Tammy

    I give...I've spent the past few days trying to figure out how the value in my hidden variable will help identify the row that I need to highlight. I have 2 buttons in each row...one button, when clicked, calls the highLight function and the row is highlighted and the pThis value returns "http://.....f?p=111:34:123456789012232::::P34_TEST:1". The other button opens the popup...I make my changes, click Apply Changes to submit and close the popup, I set my P34_TEST hidden value to the ID, which equals 1, but how am I supposed to modify the highLight function and call the function and use the ID value to find the row I want to highlight? I added a class to the column like you recommended, but when I click the first button to highlight the row, it highlights all of the columns in the table, which I understand why it does that, I just don't know how to identify the class with the ID. I know that probably doesn't make much sense to you, but I don't know enough about jQuery to put all the pieces together. I'm not looking for someone to hand me the answer, I just don't understand how it's supposed to work. Can you give me a little more detailed information on how to go about doing this?
    Thank you,
    Tammy

  • Row Highlighting

    I am trying to find a thrad / example showing how to do row highlighting using javascript. I want to highlight a row in a report by clicking on it. It is supposed to remain highlighted until I either reload / submit the form or click on an other row. Mouseover and mouseout events are not desired :). Anyone with an idea?
    Denes Kubicek
    http://deneskubicek.blogspot.com/
    http://www.opal-consulting.de/training
    http://apex.oracle.com/pls/otn/f?p=31517:1
    -------------------------------------------------------------------

    Denes,
    Here is the CSS and Javascript I use to achieve row highlighting on click..
    <style type="text/css">
    tr.odd td.t15data{background:#F4FFFD;}
    tr td.t15data{background:#FFFFFF;}
    tr.selected td.t15data{background:#D7D7D7;}
    </style>
    <script type="text/javascript">
    function addLoadEvent(func) {
      var oldonload = window.onload;
      if (typeof window.onload != 'function') {
        window.onload = func;
      } else {
        window.onload = function() {
          oldonload();
          func();
    function addClass(element,value) {
      if (!element.className) {
        element.className = value;
      } else {
        newClassName = element.className;
        newClassName+= " ";
        newClassName+= value;
        element.className = newClassName;
    function stripeTables() {
         var tables = document.getElementsByTagName("table");
         for (var m=0; m<tables.length; m++) {
              if (tables[m].className == "t15standard") {
                   var tbodies = tables[m].getElementsByTagName("tbody");
                   for (var i=0; i<tbodies.length; i++) {
                        var odd = true;
                        var rows = tbodies.getElementsByTagName("tr");
                        for (var j=0; j<rows.length; j++) {
                             if (odd == false) {
                                  odd = true;
                             } else {
                                  addClass(rows[j],"odd");
                                  odd = false;
    function lockRow() {
         var tables = document.getElementsByTagName("table");
         for (var m=0; m<tables.length; m++) {
              if (tables[m].className == "t15standard") {
                        var tbodies = tables[m].getElementsByTagName("tbody");
                        for (var j=0; j<tbodies.length; j++) {
                             var rows = tbodies[j].getElementsByTagName("tr");
                             for (var i=0; i<rows.length; i++) {
                                  rows[i].oldClassName = rows[i].className
                                  rows[i].onclick = function() {
                                       if (this.className.indexOf("selected") != -1) {
                                            this.className = this.oldClassName;
                                       } else {
                                            addClass(this,"selected");
    addLoadEvent(stripeTables);
    addLoadEvent(lockRow);
    </script>
    This will also stripe or do alternate row colors for you. If you do not want or need that functionality, just remove the stripeTables function and addLoadEvent(stripeTables)
    Hope this helps.
    -Chris

  • Row highlighting is gone on enabling inline style for columns

    We have a multi-select enabled table on which cusomter wanted to change the color based on row stauts (a column in the table).
    We did it on the column component of the table as background-color:#{row.Status == 'Inactive'? '#A5A5A5': row.Status == 'Draft'?'#D8D8D8':''};
    this works great though as soon as this is done the row highlight color is gone from the table and hence makes it impossible to know which rows are actually selected.
    we are using RUP3 (Rel 4) version of jdev 11.1.1.6.2 version from edelivery.

    To apply that css rules to only one table set property styleClass="MyCustomTable" of the <af:table> and change the above rules for these (note that each rule starts with af|table.MyCustomTable):
    af|table.MyCustomTable::status-message {background-color: #0090c1; color: white; border: 2px #a0b4ba inset;}
    af|table.MyCustomTable::column-resize-indicator {border: 1px solid #51bfff;}
    af|table.MyCustomTable::data-row:selected af|column::data-cell {border-top: 1px solid #00afea; border-bottom: 1px solid #00afea;}
    af|table.MyCustomTable::data-row:selected af|column::banded-data-cell {border-top: 1px solid orange; border-bottom: 1px solid orange;}
    af|table.MyCustomTable::data-row:selected:focused af|column::data-cell {border-top: 1px dashed #00afea; border-bottom: 1px dashed #00afea;}
    af|table.MyCustomTable::data-row:selected:focused af|column::banded-data-cell {border-top: 1px dashed orange; border-bottom: 1px dashed orange;}
    af|table.MyCustomTable::data-row:selected:inactive af|column::data-cell {border-top: 1px solid #84e0ff; border-bottom: 1px solid #84e0ff;}
    af|table.MyCustomTable::data-row:selected:inactive af|column::banded-data-cell {border-top: 1px solid green; border-bottom: 1px solid green;}
    af|table.MyCustomTable::data-row:hover af|column::data-cell,af|table.MyCustomTable::data-row:hover af|column::banded-data-cell {background-color: #bfd6b0 !important;}
    af|table.MyCustomTable af|column::data-cell:selected {background-color: #9CACC9 !important;}AP

  • Can I change the highlight colour from grey?

    Can I change the highlight colour when searching for words in a Pages? I find the grey is hard to see. Thanks, Mike

    Mike,
    As Fruhulda noted, this is a System behavior (and a source of irritation and questions since the beginning of—OS X—time). It's part of the System's way of showing which is the active window, and extends to other System set colours as well. The most noticeable (if that's the proper term for these inconspicuous non-colours) is the greying of the thumbs in the scroll bars.
    Do Provide Feedback. But make it OS X feedback instead of (or as well as) Pages Feedback.
    Regards,
    Barry
    OS X Feedback form
    Pages Feedback form

  • Change text highlight colour in Spark TextInput

    Hi,
    As the title says, anyone know how to change the highlight colour in a Spark TextInput component? By the "highlight colour" I mean that if some of the text is selected this would be the background colour of the selected text.
    Thanks.

    SetStyle("focusedTextSelectionColor", ...)
    There are also unfocusedTextSelectionColor and inactiveTextSelectionColor
    styles.

  • Highlight colour

    One of those things that's been bugging me for ages and at last remember to raise a question here...
    Is there a way to change the colour or intensity of text or table cells that are selected with the cursor? At first I thought this was an app specific thing, but then realised that I have the same issue across all apps: the highlight colour of selected things (text, cells etc) is just too washed out so it is difficult to see what's selected (eg, doing a spellcheck in Thunderbird, or selecting cells in Excel). So I guess it's an OS function but can't find anywhere to change it.
    Hoping for an answer that eases the ol' eyestrain!
    Thanks
    Ian

    That's what makes them fun!

  • Highlight colour change?

    is there a way to change the highlight colour? If I highlighted a text or website or something, the highlight colour is blue and is barely visible because I have a black/blue theme. I want to know if I can change the highlight colour to white or something so I can see perfectly.

    Most of the ui.* prefs do not exist by default (i.e. are hidden) and need to be created, in this case as a string pref.
    *http://mxr.mozilla.org/mozilla-central/source/widget/xpwidgets/nsXPLookAndFeel.cpp
    *http://mxr.mozilla.org/mozilla-central/source/widget/LookAndFeel.h
    *http://mxr.mozilla.org/mozilla-central/source/widget/cocoa/nsLookAndFeel.mm

  • Keeping selected row highlighted

    I have a datatable that has 2 panel grids in it. The first panel grid is used only to show the first image/link all the time because it is not stored in our database. The second panelGrid fetches a list of programs from our database, and lists them with an image next to the link if the user is subscribed to that program. When the page first loads up, I need the first row highlighted by default. When a user selects a program, I need to change the highlight to that the program they selected. When the user selects a program, it loads the same page, but changes an ifram that has the details of what they clicked on. How can I get the row for this program only to be selected and stay selected until they click another program. Below is my page code and my backing bean.
    <h:dataTable id="programTable" headerClass="programTableHeader" width="100%"
                                                                     value="#{Program_profile.programDataModel}" var="varprogramDataModel">
                                                                     <h:column>
                                                                          <f:facet name="header">
                                                                               <h:panelGrid id="pnlgridAboutMyPrograms" width="100%" border="0" cellpadding="0" cellspacing="0" columns="1">                                                                                
                                                                                    <h:commandLink id="lnkAboutMyPrg" action="#{Program_profile.aboutMyProgramAction}" >
                                                                                         <hx:graphicImageEx id="imgAbtMyPrg1" value="#{msg.Program_profile_About_My_Program_Image}" border="0" hspace="5"></hx:graphicImageEx>
                                                                                         <h:outputText id="txtAbtMyPrg" value="#{msg.Program_profile_About_My_Program_Name}"></h:outputText>
                                                                                    </h:commandLink>
                                                                               </h:panelGrid>
                                                                          </f:facet>     
                                                                          <h:panelGrid id="pnlgridPrograms" width="100%" border="0" cellpadding="0" cellspacing="0" columns="1"  columnClasses="">
                                                                               <h:commandLink id="programLink" action="#{Program_profile.selectedProgram}">
                                                                                    <hx:graphicImageEx id="checkMarkProgram" value="#{msg.Program_profile_Check_Mark_Image}" border="0" rendered="#{varprogramDataModel.subscribed}" hspace="5"></hx:graphicImageEx>
                                                                                    <h:outputText id="programName" value="#{varprogramDataModel.name}"></h:outputText>
                                                                               </h:commandLink>
                                                                          </h:panelGrid>
                                                                     </h:column>Backing bean:
    public String selectedProgram(){
              // A program details which is selected by the user
              ApplicationParameter.getLogger().debug(ENTRY);
              ProgramInformation selectedProgram= null;
              ProfileController profileController = new ProfileController();
              Customer customer =null;
              // Returning the value for from-outcome element of faces-config.xml file 
              String from_outcome=null;
              try{
                   //Check for customer object
                   if(!utility.isUserInSession()){
                        FacesMessage message = MessageFactory.getMessage(facesContext,"Program_profile_customer_help");
                        facesContext.addMessage("",message);
                        return ApplicationParameter.NAVIGATION_CUSTOMER_HELP;
                   selectedProgram = (ProgramInformation)programDataModel.getRowData();
                   selectedProgram=createProgramInformation(selectedProgram.getCode());
                    * Highlight the program selected
                    UICommand programCommand = getProgramLink();
                    UIComponent parent = programCommand.getParent();
                    parent.getAttributes().put("rowClasses","tnSelected");
                    ApplicationParameter.getLogger().debug("\n ***************  programCommand = "+programCommand.getClientId(facesContext));
                 ApplicationParameter.getLogger().debug("\n*************     programParent = "+parent.getClientId(facesContext));
                     * Highlight the About my programs link
    //                 UICommand aboutProgramCommand = getLnkAboutMyPrg();
    //                 UIComponent aboutParent = aboutProgramCommand.getParent();
    //                 if (!parent.getAttributes().containsKey("rowClasses")) {
    //                      aboutParent.getAttributes().put("rowClasses","tnSelected");
                   //setSelectedHighlight("tnSelected");
                   //Set in the session
                   ApplicationParameter.getLogger().debug("Iframe page ->"+selectedProgram.getInfoPage());
                   utility.getExternalContext().getSessionMap().
                             put(ApplicationParameter.SESSION_KEY_PROGRAM_INFORMATION,selectedProgram);     
                   utility.getExternalContext().getSessionMap().
                             put(ApplicationParameter.SESSION_KEY_IFRAMEPAGE,selectedProgram.getInfoPage());                                   
                   from_outcome=ApplicationParameter.NAVIGATION_PROGRAM_PROFILE;
              }catch (Exception ex){
                   ApplicationParameter.getLogger().error("\n\nException ->\n"+ex.getMessage());
                   FacesMessage message = MessageFactory.getMessage(facesContext,"Program_profile_Customer_Help_Exception");
                   facesContext.addMessage("",message);
                   return ApplicationParameter.NAVIGATION_CUSTOMER_HELP;
              ApplicationParameter.getLogger().debug(EXIT);
              return from_outcome;
         }When I click on a program link using the code above, it highligts all the rows, not just the selected one.

    can anyone please help me? I can post more code if that helps.

  • Row highlighting with Jquery

    Hi,
    I heard a lot of good things about Jquery. I was trying to see for myself how to get Jquery to work with APEX. I've this sample code snippet that does row highlighting when hovering over a table row. The code works as a html file but I can't seem to get it to work with APEX. Here's the procedure I follow in APEX:
    1. Uploaded the jquery library into APEX workspace.
    2. Modify the page template to include the jquery library. I had rename the jquery library to "jqmin_126.hs"
    &lt;script src="#APP_IMAGES#jqmin_126.js" type="text/javascript"&gt;&lt;/script&gt;
    3. Added the code snippet to the html header of APEX report page.
    &lt;style type="text/css"&gt;
    .highlight {
    background-color: #FC6 !important;
    &lt;/style&gt;
    &lt;script type="text/javascript"&gt;
    $(document).ready(function( ) {
    $('table.default1 tbody tr').mouseover(function() {
    $(this).addClass('highlight');
    $(this).css('cursor','pointer');
    }).mouseout(function() {
    $(this).removeClass('highlight');
    &lt;/script&gt;
    To keep things simple, I used the following APEX settings:
    Template: Reports region
    Report template: Default: Look 1
    Version of APEX : 3.1.2
    My interest here is mostly trying to see how jquery works with APEX and not so much the row highlighting. What am I missing?
    Thanks in advance.

    I ran into this problem as well. What happened to me is that the style associated for the TD tag was overwriting the style for the TR tag. So even though I was adding and removing classes to the TR the page would not reflect the changes.
    I would first make sure the Jquery is working by adding the following to my header section.
    $(document).ready(function( ) {
      alert('Jquery is working');
    });If it is working I would try adding .find("td") to edit the CSS of each table data thus changing the background of the row.
    <script type="text/javascript">
      $(document).ready(function( ) {
        $('table.default1 tbody tr').mouseover(function() {
          $(this).find("td").addClass('highlight');
          $(this).find("td").css('cursor','pointer');
        }).mouseout(function() {
          $(this).find("td").removeClass('highlight');
    </script>Hope this can point you in the right direction.
    Tyson
    Edited by: Tyson Jouglet on Nov 24, 2008 9:31 AM

Maybe you are looking for

  • Mac book pro will not start

    mac book pro 13 wont atart up all i get is a folder icon with a question mark in it any help ?

  • Problem: THX Config resetting after each pc rest

    Setup: I'm using the console from the original install disc, but the driver is the latest web-download driver, version 02.09.006 from 9th of oct. 2006. I'm using the original consoles because they are much more intuiti've and I can even set more thin

  • P1106 software on Mac

    Hi There, I am using mac book air with OS X 10.9.5. When I connected my printer to my laptop it did not show me any update. While installing the printer on my mac I got this error message of softare for which I have attached the picture. After instal

  • Wireing Question for Data Center

    I work in what I would consider to be a small/mid sized data center. We use two 6513 as the core/distribution for ~25 racks of servers. My question comes in the way of cabling the servers to the core. Currently they are using long patch cords between

  • Slowly changed dimenstion table

    Hi All, Let's assume we have one fact table f_table and one dimension table d_table. And certainly, f_table references d_table. d_table looks like: id district name 1 BJ 2. SH 3. TJ Currently, one challenge for me is that some row may merge into one