JavaScript resource files [message #938529] |
Wed, 10 October 2012 00:16 |
David Good Messages: 41 Registered: September 2012 |
Member |
|
|
Hi,
Whenever possible I create my JavaScript functions used by reports in external files and add them to the report via the resources ui.
I have just completed a report where I added row hover highlights, using the following functions in a text/html element placed on the report, above the first table:
<script>
// add highlighted background on hover
function hoverShadeOn(bmark, rgb) {
var currElement;
currElement = document.getElementById(bmark);
currElement.style.backgroundColor = "RGB(" + rgb + ")";
}
// remove highlighted background on hover
function hoverShadeOff(bmark){
var currElement;
currElement = document.getElementById(bmark);
currElement.style.backgroundColor = "transparent";
}
</script>
I set the first element of each row to highlight the rest of the row when hovered, using a text/html element as follows:
<a href = ""
onmouseover="hoverShadeOn('ProductLine_<VALUE-OF>row["productCode"]</VALUE-OF>','221,221,221');"
onmouseout="hoverShadeOff('ProductLine_<VALUE-OF>row["productCode"]</VALUE-OF>');"
>
<VALUE-OF>row["productLine"]</VALUE-OF>
</a>
I set it's bookmarks appropriately and it works as expected.
I decided to externalize the hoverShadeOn and hoverShadeOff functions as I will use them in other reports. I copied everything except the script tags and comments to a .js file (hoverShading.js) as follows:
function hoverShadeOn(bmark, rgb) {
var currElement;
currElement = document.getElementById(bmark);
currElement.style.backgroundColor = "RGB(" + rgb + ")";
}
function hoverShadeOff(bmark){
var currElement;
currElement = document.getElementById(bmark);
currElement.style.backgroundColor = "transparent";
}
I then removed the text/html element at the top of my report which held the functions. My hover action stops working.
As I have stated, I use external js functions often but in BIRT functions such as initialize or dataset beforeOpen.
Text elements must work differently? I considered needing to add the script tag to my function call as follows but it does not work.
onmouseover="<script>hoverShadeOn('ProductLine_<VALUE-OF>row["productCode"]</VALUE-OF>','221,221,221');</script>"
What am I missing here?
Thanks,
Dave
|
|
|
|
|
|
Powered by
FUDForum. Page generated in 0.02881 seconds