Hi,
I am trying to highlight the row in a table when you click on the checkbox which happens to be the first column. This particular HTML file contains a bunch of forms. The code given below is a concise one:
<HTML>
<HEAD>
<link rel="STYLESHEET" type="text/css" href="ips.css">
<style>
td {border-right: 2px lightgrey solid}
.cover { background: navy; color: pink}
.rover { background: #ffb164; color:white}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
var rowHighlight = true;
var colHighlight = false;
function getElement(e1)
{
var tagList = new Object;
for ( var i=1; i<arguments.length; i++ ) {
tagList[arguments[i]] = true;
}
while((e1!=null) && (tagList[e1.tagName] == null))
{
e1 = e1.parentElement;
}
return e1;
}
function highlight(which)
{
var e1 = null;
if(navigator.appName.indexOf("Microsoft") != -1){
e1 = getElement(event.srcElement, "TH", "TD");
}
if(e1 == null) return;
if((e1.tagName=="TD") && (rowHighlight))
{
var row = getElement(e1, "TR");
var table = getElement(row, "TABLE");
if(which)
row.className = "rover";
else
row.className = "";
}
}
function checkBoxHighlighting(index)
{
if(document.adjustmentsForm.SelectedAdjstmts[index].checked=="1")
highlight(true);
else
highlight(false);
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<NOSCRIPT>
<B>This page is enhanced by and therefore requires JavaScript. Upgrade to the latest version of Netscape Navigator
or Microsoft Internet Explorer.</B><P>
<P>
If you are using a JavaScript supported browser, be sure you have enabled JavaScript
in the Preferences/Options dialog box.<P>
</NOSCRIPT>
<FORM NAME="form1" METHOD="POST" target="_self">
<TABLE border="0" width="700" height="0%" CELLSPACING="0" CELLPADDING="0">
<TR VALIGN="TOP"><TD VALIGN="TOP">
<TABLE border="0" width="700" bgcolor="#006699" cellpadding="0" cellspacing="1">
<TR bgcolor="#ffffff" height="20">
<TD><INPUT type="checkbox" NAME="SelectedAdjstmts" VALUE=0 onClick="javascript:checkBoxHighlighting(0)"></TD>
<TD><IMG NAME="Image0" BORDER="0"></TD>
<TD align="center"><B>1</B></TD>
<TD align="center"><B>xxxxx</B></TD>
<TD align="center"><B>xxxxxx</B></TD>
<TD align="center"><B></B></TD>
<TD align="center"><B>xxxx</B></TD>
<TD align="center"><B>xxxx/xxxx</B></TD>
<TD><B></B></TD>
</TR>
</TABLE>
</td>
</tr>
</TABLE>
<INPUT TYPE="HIDDEN" NAME="formName" VALUE="form1">
</FORM>
<FORM NAME="form2" METHOD="POST" target="_self">
<INPUT TYPE="HIDDEN" NAME="a" VALUE="">
<INPUT TYPE="HIDDEN" NAME="b" VALUE="">
<INPUT TYPE="HIDDEN" NAME="formName" VALUE="2">
</FORM>
<FORM NAME="form3" METHOD="POST" target="_self">
<INPUT TYPE="HIDDEN" NAME="formName" VALUE="3">
</FORM>
<FORM NAME="form4" METHOD="POST" target="_top">
<INPUT TYPE="HIDDEN" NAME="formName" VALUE="4">
</FORM>
</CENTER>
</BODY>
</HTML>
The problem I am running into is sometimes, I keep getting a javascript error which says
'document.adjustmentsForm.SelectedAdjstmts[...].checked' is null or not an object'
At other times, it seems to work fine highlighting the row when I click on the checkbox and remove the highlighting when I uncheck the checkbox.
Can anybody help me as to how I can get rid of this error message. I am working with IE 6.0 and I have seen this happening only sometime on IE 5.0 and IE 5.5
Thank you,
Chuck
