Error using onclick in dropdown not with input box

I am using a multi layer drop down box as part of my site. When using the onclick function in the dropdown i get an error saying this.form is not an object on line 126. If I use the input buttons they work, the problem is that the input buttons look very bad.

<html>
<head>
<title>Application</title>

</head>

<body>

</body>
</html>
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>please work!</title>
<META NAME="AUTHOR" CONTENT="Jason Bellamy; Brandi Chubb; Thomas Losier">
<META NAME="GENERATOR" CONTENT="Cold Fusion Studio 4.5">

body {
font-family: Times New Roman;
font-size: 14;
text-align: center;
}

#nav, #nav ul { /* all lists */
align: center;
padding: 0;
margin: 0;
list-style: none;
float : left;
width :16em;
}

#nav li { /* all list items */
align: center;
position : relative;
float : left;
line-height : 1em;
margin-bottom : -1px;
width: 11em;
}

#nav li ul { /* second-level lists */
position : absolute;
left: -999em;
margin-left : 10em;
margin-top : -1.15em;
}

#nav li ul ul { /* third-and-above-level lists */
left: -999em;
margin-top : -1.15em;
}

#nav li a {

width : 10em;
display : block;
color : black;
text-decoration : none;
background-color : white;
border : 2px solid black;
padding : 0 0.5em;
}

#nav li a:hover {
color : white;
background-color : black;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul { /* lists nested under hovered list items */
left: auto;
}

#content {
margin-left : 12em;
}

</style>

sfHover = function() {
var sfEls = document.getElementById("nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

</script>

</head>
<body>

<input type="hidden" name="MyValue" value="#HTMLEditFormat(form.MyValue)#">
<table align="center" width=620 bgcolor="00CCCC" border="2" >
<tr> <Td align="right">
<strong>What Information would you like to change?</strong>
</Td>
<td>
<ul id="nav">
<li><a href="#" onclick="this='/testing/employee/search/update2.cfm?Action=4';">Contact's Information</a>
</li>
<li><a href="#">Site's Information</a>
<ul>
<li><a href="#">Change Site Info
<input type="submit" name="submit3"
value="Click Here"
onclick="this.form.action='/testing/employee/search/update2.cfm?Action=3';">
</a>
</li>
<li><a href="#">Change Contact Person</a>
<ul>
<li><a href="#">For Job Number 0 only
<input type="submit" align="right" name="submit2"
value="Click Here"
onclick="this.form.action='/testing/employee/search/update2.cfm?Action=2';">
</a></li>
<li><a href="#">For every Job associated with this contact
<input type="submit" name="submit1"
value="Click Here"
onclick="this.form.action='/testing/employee/search/update2.cfm?Action=1';">
</a></li>
</ul>
</li>

</ul>
</li>
</ul>
</td>
</tr>
</table>

</form>
</body></html>

Error using onclick in dropdown not with input box

tjsoccer9

dcrombie

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week