PDA

View Full Version : Table Row highlight in FF



yvorl
Nov 28th, 2007, 09:28 AM
Hi! I've got this code for highlight a row in a table:


<html>
<head>
<script>
var preEl ;
var orgBColor;
var orgTColor;
function HighLightTR(backColor,textColor){
if(typeof(preEl)!='undefined') {
preEl.bgColor=orgBColor;
try{ChangeTextColor(preEl,orgTColor);}catch(e){;}
}
var el = event.srcElement;
el = el.parentElement;
orgBColor = el.bgColor;
orgTColor = el.style.color;
el.bgColor=backColor;

try{ChangeTextColor(el,textColor);}catch(e){;}
preEl = el;
}

function ChangeTextColor(a_obj,a_color){ ;
for (i=0;i<a_obj.cells.length;i++)
a_obj.cells(i).style.color=a_color;
}
</script>
</head>

<table border=1 align=center>
<caption>Something</caption>
<th>test1</th>
<th>test2</th>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1111</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>2222</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>3333</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>4444</td>
<td align=right>Test</td>
</tr>
</table>
</html>


It works fine under IE, but not under Firefox.
Does anybody have an idea to make it work under FF also? :confused:

Thx

shyam
Nov 28th, 2007, 09:46 AM
<html>
<head>
<script>
var orgBColor = '#ffffff';
var orgTColor = '#000000';
function HighLightTR(target, backColor,textColor) {
var tbody = target.parentNode;
var trs = tbody.getElementsByTagName('tr');
for ( var i = 0; i < trs.length; i++ ) {
if ( trs[i] != target ) {
trs[i].style.backgroundColor = orgBColor;
trs[i].style.color = orgTColor;
} else {
trs[i].style.backgroundColor = backColor;
trs[i].style.color = textColor;
}
} // endfor i
}
</script>
</head>

<table border=1 align=center>
<caption>Something</caption>
<th>test1</th>
<th>test2</th>
<tr onClick="HighLightTR(this, '#c9cc99','cc3333');" >
<td align=right>1111</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR(this, '#c9cc99','cc3333');" >
<td align=right>2222</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR(this, '#c9cc99','cc3333');" >
<td align=right>3333</td>
<td align=right>Test</td>
</tr>
<tr onClick="HighLightTR(this, '#c9cc99','cc3333');" >
<td align=right>4444</td>
<td align=right>Test</td>
</tr>
</table>
</html>