Highlight current row on Interactive Report

What is the best way to highlight (or identify) the current row in an Interactive Report?
I’ve created an interactive report, based on a custom SQL query, with a link (on the primary key (id)) to give the user the possibility to select a certain record (that will show some additional regions with detail information). How can I identify (highlight, indicator) the selected row in an Interactive Report?
Many thanks for your help,
John

I wanted the same without using jQuery. Roel's example set me on the right track. To ensure keeping my current row highligthing after using the pagination links I've managed to dynamicly modify the pagination link in the IR using javascript, but I have a little (I hope) problem left.
I've managed to change the pagination link when rendering the page from
<a h ref="javascript:gReport.navigate.paginate('pgR_min_row=16max_rows=15rows_fetched=15')"></a>to
<a h ref=javascript:gReport.navigate.paginate('pgR_min_row=16max_rows=15rows_fetched=15');highLight(this)></a>Unfortunatly my added code does not notice the changes made by the gReport.navigate.paginate code. It does only work when I add an alert (); in my highLight code. This alert will force showing the changes made in the DOM-model by gReport, allowing the highLight function to re-exame the DOM-model and change the pagination link.
Anyone an idea how to overcome this problem ?
Kind regards,
Ralph

Similar Messages

  • Hide filter type - row in interactive report

    Hello all,
    how can I deactivate or hide the filter type - row in interactive report and the only option to be filter type - column?
    Is it possible with some javascript?
    Thanks in advance !

    The CSS approach works fine, but I made some improvements:
    1. CSS-Selector is case sensitive
    2. Only select the label with the attribute for="apexir_FILTER_TYPE". Attention: the CSS-Selector for the for-attribute works in IE and Firefox different
    /* Hide IR Filter Type Row */
    #apexir_FILTER_TYPE {
    display:none;}
    /* IE */
    label[htmlFor="apexir_FILTER_TYPE"] {
    display:none;}
    /* Firefox */
    label[for="apexir_FILTER_TYPE"] {
    display:none;}

  • Highlight  a row in classic report based on condition

    HI all Gurus
    Using Apex 4.1.1 oracle 11g linux oc4j
    I want to highlight a row where #column_value#='Y' to grey  keep others as normal report settings.
    I have a simple sql query
    SELECT PK_ID,
      FIRST_NAME,
      LAST_NAME,
      INITIAL_REG_DATE,
      MAIL_DATE,
      BEGIN_DATE,
      END_DATE,
      END_DATE-BEGIN_DATE as "#days",
      BEGIN_STATUS,
      END_STATUS, 
      COMMENTS,
      DELETE_FLAG,
    case when  DELETE_FLAG='Y' then 'GREY' else '#f0f0f0' end  DELETE_FLAG ,
    INITIAL_REG_DATE+(END_DATE-BEGIN_DATE) "New Reg end date"
    FROM SOR_TRACKING_DEL
    where pk2_id =:P216_Detail
    order by mail_Date desc
    I created a Dynamic action
    which will fir on on load , BIND on this classic report
    $("input[name=f29]").each(function(){ 
    var lThis=$(this); 
    if(lThis.is("Y")){ 
      lThis.parents("tr:eq(0)").children("td").css({"background-color":"GREY"}); 
    } else { 
      lThis.parents("tr:eq(0)").children("td").css({"background-color":"#f0f0f0"}); 
    But this is not changing color as expected..
    Kindly help me !
    Thanks

    Scott and Tom
    Thanks you guys for looking into this.
    Pls ignore my improper explanation and my inexperience with jquery.
    I read some blog and was trying to do same on classic report but all blogs I found so far referred either interactive report or tabular report none of them mentioned classic report.
    I guess using array for classic report wont be a good idea to start with. :/
    I am not sure if this is right syntax and logic to highlight the row
    $(function(){
    var DELETE_FLAG = $(this);
        if DELETE_FLAG.is("Y"))
      DELETE_FLAG.parents("tr").children("td").css({"background-color":"GREY"});
    I also created app here
    http://apex.oracle.com/pls/apex/f?p=35155
    workspace sors
    user tester/testing
    application 35155
    Thanks again.

  • Highlight Current Row

    Apex 4.2
    Theme 21
    I am able to highlight current form fields using get focus and lose focus dynamic actions.
    How do I highlight the current row of a tabular form or updateable report.
    I have tried using DA with
    JQuery Selector tr[headers="FEE"] (column in my report)
    Execute Javascript
    $x_RowHighlight(this.triggeringElement,'yellow');
    Any help appreciated
    Gus

    Gus ,
    you can look at my demo ... ( the one you aked for in my other discussion)
    http://apex.oracle.com/pls/apex/f?p=53793
    demo / demo
    when i click on on row of the IR , the text of selected row is set to red .
    i m sure that you can use it to highlight your row .
    Just remember that when you set for example background-color of a cell, the style of the region may hide what you try to change. I m not sure why but if you disable the region class
    your modifications will appears.

  • Multiple Radiobuttons per row in Interactive Report

    I added some code per Vincent Deelen's "Using radio buttons in an APEX report"
    Vincent Deelen: Using radio buttons in an APEX report
    This works just like his blog says it will with one problem.
    My interactive report has more than one page of data. Whenever I click to go to the
    second page of data, the click event on the radiobuttons in the dynamic action no longer works.
    I leave the page items that stores my key values unhidden and they do not change once I change pages in my interactive report.
    Any ideas as to what to do or something I am missing.
    Apex 4.2.1
    Oracle 11g database
    blue responsive theme 25
    Here is my query
    select q_cev,
           apex_item.radiogroup(p_idx            => rownum,
                                p_value                    => 'Y',
                                p_selected_value      => gmpick_flag01,
                                p_display                 => 'Yes',
                                p_attributes              => 'class="gmpickflag01 flagY"')
                                as RBYES,
           apex_item.radiogroup(p_idx            => rownum,
                                p_value                    => 'N',
                                p_selected_value      => gmpick_flag01,
                                p_display                 => 'No',
                                p_attributes              => 'class="gmpickflag01 flagN"')
                                as RBNO,
           apex_item.radiogroup(p_idx            => rownum,
                                p_value                    => 'U',
                                p_selected_value      => decode(gmpick_flag01,null,'U',
                                                                    'U','U',gmpick_flag01),
                                p_display                => 'Undecided',
                                p_attributes             => 'class="gmpickflag01 flagU"')
                                as RBUND,
           sort_qkey1,sort_qkey2,sort_qkey3,
           q_key1_trans, q_key2_trans, q_key3_trans
    from cts_ajha_q_ref LEFT OUTER join cts_gen_multipick
       on (cts_ajha_q_ref.q_cev = cts_gen_multipick.gps_cev
            and cts_gen_multipick.gmpickcode= 'CTS551HZGRCKLIST01'
            and cts_gen_multipick.op_cev = :P155102_OP_CEV)
    where cts_ajha_q_ref.cts_no_show is null
        and cts_ajha_q_ref.cts_showflag01 is not null
    I created a dynamic Action
    Event:       
    Click
    Selection Type:
    jQuery Selector
    jQuery Selector:  .gmpickflag01
    Execute Javascript Code
    var rbyes = $('#radioReport .apexir_WORKSHEET_DATA tbody tr td[headers="RBYES"] input:checked').map(function() {
       return $(this).parent().parent().find('td[headers="Q_CEV"]').html()}).get().join(':')
    var rbno = $('#radioReport .apexir_WORKSHEET_DATA tbody tr td[headers="RBNO"] input:checked').map(function() {
       return $(this).parent().parent().find('td[headers="Q_CEV"]').html()}).get().join(':')
    var rbund = $('#radioReport .apexir_WORKSHEET_DATA tbody tr td[headers="RBUND"] input:checked').map(function() {
       return $(this).parent().parent().find('td[headers="Q_CEV"]').html()}).get().join(':')
    //Send the delimited Q_CEV's to hidden page items to submit.
    $s('P155102_RBYES',rbyes)
    $s('P155102_RBNO',rbno)
    $s('P155102_RBUND',rbund)
    Also have code to step thru the page items to insert into database.

    Hi,
    With the code as it is, you'll have to submit your change before you jump to your next paginated set of rows. You'd either have to create a submit function on paginate, or rewrite the map function in the dynamic action to save the result set of your the results on the pagiation set that you are leaving.
    Javascript only works on the data that is actually on the page, ie can be found with html. When you paginate to the next set of rows, the data on the previous set can no longer be manipulated or consulted.
    Regards
    Vincent
    http://vincentdeelen.blogspot.com

  • Alternating Row Colors - Interactive Report

    Hello All,
    I'm hoping someone out there can help me out w/this. :)
    I'm a newbie working w/an Interactive Report and want to have alternating row colors as a default w/out losing the IR advantages.
    I've tried javascript, but, whenever filters are applied the class gets stripped off.
    Has anyone had any luck w/this?
    Thanks In Advance

    Roel,
    I got it working... Adding the onload to the image is pretty awesome, I had to chuckle cause I would've never thought of that.
    It wasn't working for me earlier, but, i realized after it was a silly syntax error. :P
    Anywho - Check the link below.
    http://apex.oracle.com/pls/otn/f?p=17445:7::::::
    I had used a different striping script which was written by a buddy of mine Keith Daulton (Had to throw him props for a hawt script. Works in ie6/7, FF, Chrome & Safari).
    I'm 100% sure I'm not the only one who's wanted this done and struggled to get it. So below I'm providing it for those who run into this thread.
    <script type="text/javascript">
    // THIS DOES THE STRIPING
    function decorateDataGrids (strClass) {
         var tables = document.getElementsByTagName("table");
         for (var i=tables.length; i--;) {
              if (tables.className == strClass) {
                   var gridRows = tables[i].getElementsByTagName("tr");
                   for (var j=gridRows.length; j--;) { if (j%2) { gridRows[j].className = "even"; } }
    window.onload = function () {
         decorateDataGrids("apexir_WORKSHEET_DATA"); // THIS DOES THE STRIPING
    </script>
    <style>
    /* THIS OVERRIDES APEX'S DEFAULT STYLES */
    table.apexir_WORKSHEET_DATA tr.even td {
         background-color:#F1F5FA !important;
    table.apexir_WORKSHEET_DATA td {
         background-color:#FFFFFF !important;
         border:1px solid #B3B3A7 !important;
         padding:4px 8px !important;
    </style>
    onload event strapped to the img -- Thanks!!!
    <img src="#IMAGE_PREFIX#edit.gif" alt="" onload="decorateDataGrids('apexir_WORKSHEET_DATA');">
    Edited by: user11086646 on Jun 9, 2009 7:04 PM

  • Multiple rows in interactive reports?

    Can we click on multiple rows at a time in interactive reports??
    If yes how.....
    Would reward.
    thanks

    alchemi,
        u can use that one by using the  hide stmt on the desired two fields.
    And in the first secondary list, u can put a if condition for the hided fields. so that if the condition is satisfied u can process a set of commands else process the other block of commands.
    Regards...
    Arun.
    Reward points if useful.

  • Highlight Multiple Rows in a Report

    Hello all,
    I'm trying to implement a highlight as seen here,
    http://www.netlobo.com/javascript_background_color_toggle.html
    function toggleBgColor(elem)
    var style2 = elem.style;
    style2.backgroundColor = style2.backgroundColor? "":"#FFFF00";
    I have the above javascript in my report's region header and an onclick = "toggleBgColor(this);" in my report template (Horizontal border)
    I can run the page, but nothing happens on click. No errors and no highlighting.
    Any ideas are much appreciated.
    Thanks

    Both places should work, but the page header is cleaner.
    Maybe it's not in the correct place in the template? Can you put up an example on apex.oracle.com?
    I linked to Carl's sample app more as a general HTML/CSS/javascript intro, especially for plugging things into APEX. He doesn't have an example exactly like you're looking for, but he does have some row highlighting here.

  • Highlight Search Words in Interactive Report

    I have been searching and searching for days for a solution to highlight the search words in the IR. I was thinking to grab the search field value and do a global replace in the report region, but it looks like the search report is generated by javascripts. I really appreciate if anyone can help me out..thanks
    Edited by: 889129 on Oct 3, 2011 10:19 AM

    Is this the kind of thing?
    http://apex.oracle.com/pls/apex/f?p=579:45
    Basically, implement this JQuery plugin
    http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html
    Then create a hidden/unprotected item 'P45_SEARCH'
    Next create 2 x dynamic actions:
    1. Before Region Refresh run JS
    $("#P45_SEARCH").val($("#apexir_SEARCH").val());2. After Region Refresh run JS
    var lv_search = $('#P45_SEARCH').val();
    if (lv_search) {
    $('td').highlight(lv_search);
    }I've not had time to polish it, but it might give you some ideas.
    I hope it helps
    Shunt

  • Highligh current row not working for classic report in 4.1

    Hello experts,
    One of our customers is migrating applications from APEX 3.0 to 4.1.
    All their applications use classic reports because interactive reports didn't exist in 3.0.
    The end users of the applications like the row color changing when they hover there mouse over the rows (highlight current row) and they insist on keeping this "functionality" in the applications.
    For some reason, this "functionality" doesn't work anymore after the migration to APEX 4.1.
    I thought it was something theme related so I created a new application with a classic report, tried some APEX built-in themes, and with none of them, I manage to get the highlight current row working.
    For interactive reports it is not an issue.
    Is this an undocumented no-longer-available feature of APEX 4.x or has there changed something which caused this functionality to stop working??
    Regards,
    Bart

    Hi,
    I created a service request for this issue, and the support analyst that helped me confirmed that this is a bug:
    "I have created the bug :
    Bug 13584762 - ROW HIGHLIGHTING NO MORE WORKS IN CLASSIC REPORT IN APEX 4.1
    While working on the problem , I have found the following solution in order to make the Row HighLightng work in APEX 4.1
    In the apex_4_1.min.js (file located in images\javascript ) , Search for :
    function setRowHighlight(a){apex.jQuery("#report_"+a+" .highlight-row").live("hover",function(b)
    and replace "hover" by "mouseover mouseout" :
    After the modification :
    function setRowHighlight(a){apex.jQuery("#report_"+a+" .highlight-row").live("mouseover mouseout",function(b)
    A refresh in the browser may be necessary in order to "reload" the file apex_4_1.min.js"
    I implemented the suggested workaround and this solved the problem!
    HTH,
    Matthias Hoys

  • How to highlight a row in a standard report?

    Friends,
    Hope you can help.
    I need to highlight a row in standard report dependent on some criteria.
    Having searched the forum I have been trying to implement the example given here.
    This is what I have done:
    1) Create a new report using the following query
    select decode(deptno, 10, 'class1', 20, 'class2', 30, 'class3') trclass , ename, job, sal, comm from emp
    2) Created a new Report Row Template from scratch and added the details given in the example above.
    3) Placed the CSS Style sheet code in the stylesheet box at the following location:
    Shared Components>Cascading Style Sheets>Edit Cascading Style Sheet
    3) Ran the page
    4) Employee report is displayed but nothing is highlighted.
    What have I done wrong?
    Thanks in advance for any help given (which of course will be marked helpful\correct!)
    Ian

    >
    >
    3) Placed the CSS Style sheet code in the stylesheet box at the following location:
    Shared Components>Cascading Style Sheets>Edit Cascading Style Sheet
    >
    What have I done wrong?The CSS needed to go in the page HTML Header.

  • How to highlight selected  row in a region ? ? ?

    Hi There!
    I have two regions Region1 and Region2. Region2 data is populated when I select a row in Region1.
    Now I have Region1 and Region2 data on the same page, but I cant exactly tell which row in Region1 corresponds the data in Region2.
    I was thinking of highlighting the row which was selected in Region1. Went through couple of solutions, but wasnt able to implement it.
    So was wondering if any one of you know a easy to understand and implement a solution for this problem.
    Any help or suggestions is greatly Appreciated.
    Thank you
    Krishna

    Hi krishna,
    You can try this
    http://roelhartman.blogspot.com/2009/06/highlight-row-in-interactive-report.html
    and examples
    http://apex.oracle.com/pls/otn/f?p=ROEL:CURROW:763487747488998
    http://apex.oracle.com/pls/apex/f?p=34839:27:0
    or try solutions from this thread
    Highlighting currently selected row in a Report-Form page
    hope this will help you
    regards,
    Chetan
    Edited by: Chetan on 24 May, 2010 12:44 PM
    Edited by: Chetan on 24 May, 2010 12:45 PM

  • Can Highligt current row being changed mid-app?

    I have a table called PREFERENCES which allows users to set their environment to their preferences. One of the things I would like to set is their Highlight Current row Color. I have created an application level item named F101_HIGHLIGHT. On app startup, I read the database value into this global Application item.
    In the report region I have set the highlight current row item to &F101_HIGHLIGHT. . However, I have noticed when the page renders, the page source has &F101_HIGHLIGHT. within quotes as a literal.
    Is there any way to use substitution for this feature?
    Thank you for your kind help.
    --JM                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               

    I have a table called PREFERENCES which allows users to set their environment to their preferences. One of the things I would like to set is their Highlight Current row Color. I have created an application level item named F101_HIGHLIGHT. On app startup, I read the database value into this global Application item.
    In the report region I have set the highlight current row item to &F101_HIGHLIGHT. . However, I have noticed when the page renders, the page source has &F101_HIGHLIGHT. within quotes as a literal.
    Is there any way to use substitution for this feature?
    Thank you for your kind help.
    --JM                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               

  • Easy way to highlight the row you are editing

    Hi,
    How can I easily highlight the row in a report with an edit button when I click this button. If I click it I go to another page but when I come back( After saving modifications) I want the row I just edited highlighted
    Thank you for the help
    Erwin

    Hello Erwin,
    First, you need to add an ID to every row in your report, so you’ll be able to manipulate it on the DOM level. Duplicate your report template, and edit the Before Each Row field to look similar to the following:
    <tr #HIGHLIGHT_ROW# id="#ROWNUM#">I’m using a hidden item on the report page, to hold the rownum of the report line I’m branching to edit. I’m setting this item in the link column (or in the f?p URL) to be #ROWNUM#.
    I’m using an onload event to fire the following JS function:
    function colorLinkRow(pItem, pColor) {
       var elm = $x(pItem);
       if (elm.value > 0) {
         $x(elm.value).style.backgroundColor = pColor;
    }The pItem parameter is the hidden item name, and the pColor is the background color I want to use.
    This code assuming only one report region per page. Otherwise, you need to take different approach to setting unique IDs to your reports lines.
    Regards,
    Arie.

  • Highlighting currently selected row in a Report-Form page

    Hi,
    I have a page with Report - Form layout. On the top of the page there is a classical report (not IR). When the user click a row then I display a detail form below it. It would be nice if I could highlight the row the user clicked last time, to indicate to which row the detail data below the report belongs to. Did any body do something similar?
    Regards, Tamas

    It's relatively simple to achieve this&mdash;without JavaScript&mdash;using a named column report template and CSS:
    http://apex.oracle.com/pls/apex/f?p=34839:27:0
    We'll assume a page item (or items) already exists for receiving the master row primary key value(s). In the example this is P27_DEPTNO. Give the master report region a static ID for use in CSS selectors. Here this is department.
    If the master primary key value(s) are used as links in the report, then [column link] columns need to be created to replace them in the report attributes.
    Create a named column report template as required by your report query, including an HTML ID attribute for the report row element that contains column references to the primary key value(s). Replace column references in the row template for any primary key link columns with the [column link]s created previously. In the example, [column link] (ref #4#) replaces DEPTNO (ref #1#) as we need to reference the original DEPTNO value in the row ID:
    Row Template
    <tr id="dept-#1#">
      <td class="t17data">#4#</td>
      <td class="t17data">#2#</td>
      <td class="t17data">#3#</td>
    </tr>We then just need to use the selected P27_DEPTNO value via substitution in a page HTML Header to create a descendant selector that will apply a highlight to the cells in the currently selected row (along with some others to make it easier to select the row):
    CSS
    <style type="text/css">
    /* Make the whole table cell a link target */
    #department td {
      padding: 0;
    #department td a:link {
      display: block;
      padding: 2px 8px;
    /* Universal Selector sucks */
      font-size: 9pt;
    /* Highlight the selected row */
    #department tr#dept-&P27_DEPTNO. td {
      background-color: #eee;
    </style>

Maybe you are looking for

  • Restore solaris db on linux can't restore controlfile

    Hi all. Hope someone can help with this. I take my backups with this conf. configure controlfile autobackup on; configure controlfile autobackup format for device type disk to '/u02/backup/rman/<sid>/ctl_sp_bk_%F'; I do full backups at 3:00 am and ar

  • Help with creating a PDF

    I am a First Year Graphic design student and have agreed to design some business cards for a friend. I have designed in Indesign and am trying to export as a PDF. Im still pretty confused about all of teh options and was wondering whether anyone coul

  • Aperture 2.1.1 crashing prior to splash page opening.

    Tried to open Aperture 2.1.1 this morning and it crashes before the splash page appears. This is the message that I get in the Console: dyld: Library not loaded: /Library/Frameworks/PluginManager.framework/Versions/B/PluginManager Referenced from: /A

  • Regd ABAP HR query

    Hi All, I have a requirement where i have to get the data for Basic Pay and DA from infotype 0008 as:- Basic Pay     :-  Q0008-BETRG for Q0008-LGART = 1010, 1011 , 020, 1030 (earliest)         Q0008-BETRG for Q0008-LGART = 1010,1011,1020,1030 (latest

  • Linking two different query created in SQVI

    Hi friends 1) How to link two different queries created in SQVI The output of the first query will  the input of the second query for example i have created one query to extract the material documents, now i want to pass this material documnts into t