Column Highlighting Not Working in Chrome or Firefox but works in IE

Question

Version  4.1.1.00.23
Hello,
I have a classic report that I'm trying to apply dynamic column highlighting on.
I'm following the discussion from Jari https://forums.oracle.com/thread/2209261
The columns to be highlighted are being determined from a table that gets set every month and the value are being selected in the report query.
The javascript that is in the Region Footer is:
[code]
<script type="text/javascript">
    $(function()
        $('##REGION_ID# input[name="f01"]').each(function(i)
            if ($x('f01').value == 1)
                var forcast = "JANFORECAST";
                var actual  = "JANACTUALS";
                var mth_var = "JANVAR";
                var mth_var_pnct = "JANVARPER";
            if ($x('f01').value == 2)
                var forcast = "FEBFORECAST";
                var actual  = "FEBACTUALS";
                var mth_var = "FEBVAR";
                var mth_var_pnct = "FEBVARPER";
            if ($x('f01').value == 3)
                var forcast = "MARFORECAST";
                var actual  = "MARACTUALS";
                var mth_var = "MARVAR";
                var mth_var_pnct = "MARVARPER";
            if ($x('f01').value == 4)
                var forcast = "APRFORECAST";
                var actual  = "APRACTUALS";
                var mth_var = "APRVAR";
                var mth_var_pnct = "APRVARPER";
            if ($x('f01').value == 5)
                var forcast = "MAYFORECAST";
                var actual  = "MAYACTUALS";
                var mth_var = "MAYVAR";
                var mth_var_pnct = "MAYVARPER";
            if ($x('f01').value == 6)
                var forcast = "JUNFORECAST";
                var actual  = "JUNACTUALS";
                var mth_var = "JUNVAR";
                var mth_var_pnct = "JUNVARPER";
            if ($x('f01').value == 7)
                var forcast = "JULFORECAST";
                var actual  = "JULACTUALS";
                var mth_var = "JULVAR";
                var mth_var_pnct = "JULVARPER";
            if ($x('f01').value == 8)
                var forcast = "AUGFORECAST";
                var actual  = "AUGACTUALS";
                var mth_var = "AUGVAR";
                var mth_var_pnct = "AUGVARPER";
            if ($x('f01').value == 9)
                var forcast = "SEPFORECAST";
                var actual  = "SEPACTUALS";
                var mth_var = "SEPVAR";
                var mth_var_pnct = "SEPVARPER";
            if ($x('f01').value == 10)
                var forcast = "OCTFORECAST";
                var actual  = "OCTACTUALS";
                var mth_var = "OCTVAR";
                var mth_var_pnct = "OCTVARPER";
            if ($x('f01').value == 11)
                var forcast = "NOVFORECAST";
                var actual  = "NOVACTUALS";
                var mth_var = "NOVVAR";
                var mth_var_pnct = "NOVVARPER";
            if ($x('f01').value == 12)
                var forcast = "DECFORECAST";
                var actual  = "DECACTUALS";
                var mth_var = "DECVAR";
                var mth_var_pnct = "DECVARPER";
            $(this).parents("tr:first").find('[headers="' + forcast + '"]').css({"background-color":"silver"});
            $(this).parents("tr:first").find('[headers="' + actual + '"]').css({"background-color":"silver"});
            $(this).parents("tr:first").find('[headers="' + mth_var + '"]').css({"background-color":"silver"});
            $(this).parents("tr:first").find('[headers="' + mth_var_pnct + '"]').css({"background-color":"silver"});
</script>
[/code]
The highlighting works in Internet Explorer, but the same columns are not being highlighted in Chrome or Firefox and there are no errors being reported in either browser.
Can someone help me with this?
Is there additional information I can provide that I haven't.
Thanks,
Joe

Answer 1

Hi Fac,
This is a classic report. After debugging all 3 browsers I finally found the issue.  First, my javascript isn't very good.
When I looked at the source of the page, I saw that 'F01' contained the value to determine which month's columns to highlight.
I then thought that if I evaluated the contents of 'F01', using $x('f01').value, that I could set my variables in my if statements.
During my debugging of the javascript in each of the browsers I came upon the 'this' object being displayed in the watch window. When I expanded the node to view the contents I saw that it also contained the value of the month to highlight as well.
I have since changed my 'if' statement to if ($x(this).value == <month number> and the hightlighting is working in all 3 browsers correctly.
Is this still not the right approach as Jari discusses in his post I referenced above?
Thanks,
Joe