PDA

View Full Version : document.getElementById has no properties Error



dariggy
10-13-2008, 09:46 PM
Folks,

It has been a while since I have coded in Javascript so if this error is obvious, I apologize. I am getting document.getElementById("Badd1") has no properties Error in line 71 of the following code. originally I anly had my form variables with a name tag but I have included ID tags on all fields as well. then I though the Javascript may not be loading until after the form so I included the windows.onload=advance; line but still to no avail.

My code works in IE but not Firefox. I would appreciate any help as I have been staring at this for a week.

<script type="text/javascript">
function advance() {
var fname = document.getElementById("FullName").value;
var badd1 = document.getElementById("BAdd1").value;
var bcity = document.getElementById("BCity").value;
var bzip = document.getElementById("BZip").value;
var email = document.getElementById("emailaddress").value;
var sadd1 = document.getElementById("SAdd1").value;
var scity = document.getElementById("SCity").value;
var szip = document.getElementById("SZip").value;
var to = document.getElementById("Age_Verify").checked;
var ccname = document.getElementById("CC_Name").value;
var cctype = document.getElementById("CCType").value;
var ccnumber = document.getElementById("CC_Number").value;
var Fest = document.getElementById("T_GF").value;
var Dinner = document.getElementById("T_WMD").value;

var error = "";
if ((Fest == "0") && (Dinner== "0")) {
error = error + "-No Tickets Were Ordered\n";
}
if (fname=="") {
error = error + "-Full Name\n";
}
if (badd1=="") {
error = error + "-Billing Address\n";
}
if (bcity=="") {
error = error + "-Billing City\n";
}
if (bzip=="") {
error = error + "-Billing Zip Code\n";
}
if (email=="") {
error = error + "-Email\n";
}
if (sadd1=="") {
error = error + "-Shipping Address\n";
}
if (scity=="") {
error = error + "-Shipping City\n";
}
if (szip=="") {
error = error + "-Shipping Zip Code\n";
}
if (ccname=="") {
error = error + "-Credit Card Name\n";
}
if (cctype=="") {
error = error + "-Credit Card Type\n";
}
if (ccnumber=="") {
error = error + "-Credit Card Number\n";
}
if (error != "") {
alert("The following fields are required:\n"+error)
if (!to) {
alert("You must verify that you are over 21 by clicking the checkbox.")
}
} else if (!to) {
alert("You must verify that you are over 21 by clicking the checkbox.")
} else {
document.getElementById("form1").submit();
}
}
window.onload=advance;
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<link href="/bawp2004.css" rel="stylesheet" type="text/css" />
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>Pinot Days Order Form</title>

<link href="bawp2004.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
a:link {
color: #660000;
text-decoration: underline;
}
a:visited {
text-decoration: underline;
}
a:hover {
text-decoration: underline;
}
a:active {
text-decoration: underline;
}
body {
background-color: #33460C;
}
-->
</style>
<script type="text/javascript" src="../p7pm/p7popmenu.js"></script>
<style type="text/css" media="screen">
<!--
@import url("../p7pm/p7pmh1.css");
.style22 {color: #FFFFFF}
-->
</style>
</head>
<link href="/bawp2004.css" rel="stylesheet" type="text/css" />

<body onload="P7_initPM(1,1,1,-20,10)">
<table width="1026" height="604" align="center" cellpadding="0" cellspacing="0" bgcolor="#33460C">
<tr>
<td height="199" align="left" valign="top"> <table width="1031" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td width="1031"><div align="center"><span class="pinothdrsmallBOLD">Pinot Days Event Order Form </span></div></td>
</tr>

<tr>
<td><table width="963" border="0" cellspacing="10" cellpadding="0">
<tr>
<td width="943" ><div class="pinothdrsmallBlack">
</div></td>
</tr>
</table></td>
</tr>
<tr>
<td><form method="POST" name="form1" action="">
<table width="964" align="center">
<tr valign="baseline">
<td width="155" align="right" nowrap>Full Name*:</td>
<td width="386" align="left">
<div><input name="FullName" id="FullName" type="text" class="inputfield_small" value="" size="40" maxlength="40"> </td>
<td width="95" align="right">&nbsp;</td>
<td width="308">&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Address*:</td>
<td align="left">
<input name="Badd1" type="text" class="inputfield_small" id="Badd1" value="" size="60" maxlength="75"> </td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right"></td>
<td align="left">
<input name="BAdd2" type="text" class="inputfield_small" id="BAdd2" size="60" maxlength="75"> </td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">City*:</td>
<td align="left"><input name="BCity" type="text" class="inputfield_small" id="BCity" size="30" maxlength="30" /></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td align="right" nowrap="nowrap">State*:</td>
<td align="left"><select name="BState" size="1" class="inputfield_small" id="BState">
<option value=" ">-- Please Select a Billing State --</option>
<%
While (NOT statelist.EOF)
%>
<option value="<%=(statelist.Fields.Item("StateID").Value)%>"><%=(statelist.Fields.Item("StateID").Value)%></option>
<%
statelist.MoveNext()
Wend
%>
</select></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Zip Code*:</td>
<td align="left"><input name="BZip" type="text" class="inputfield_small" id="BZip" size="15" maxlength="15" /></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Email Address*: </td>
<td align="left"><input name="emailaddress" type="text" class="inputfield" id="emailaddress" size="60" maxlength="60" /></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td nowrap align="right">Telephone:</td>
<td align="left"><input name="telephone" type="text" class="inputfield" id="telephone" size="15" maxlength="20" /></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td colspan="4" align="right" nowrap><div align="left">
<hr />
</div></td>
</tr>
<tr valign="baseline">
<td colspan="2" align="right" nowrap><div align="left"><span class="Header_1"><b>Shipping Information</b>&nbsp;&nbsp;&nbsp;</span></div></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td width="155" align="right" class="Standard_Text">Same as Billing:&nbsp;</td>
<td width="386" align="left" class="Standard_Text"><input name="checkbox" type="checkbox" class="form_input_small" id="same" onclick="sUpdate()" value="same" /></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="28" align="right" class="Standard_Text">Address:&nbsp;</td>
<td class="Standard_Text" align="left"><input name="SAdd1" type="text" class="inputfield_small" id="SAdd1" value="<%= SAdd1%>" size="60" maxlength="75" onchange="addUpdate('SAdd1')"/></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="28" align="right" class="Standard_Text"></td>
<td class="Standard_Text" align="left"><input name="SAdd2" type="text" class="inputfield_small" id="SAdd2" value="<%= SAdd2%>" size="60" maxlength="75" onchange="addUpdate('SAdd2')"/></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="28" align="right" class="Standard_Text">City:&nbsp;</td>
<td class="Standard_Text" align="left"><input name="SCity" type="text" class="inputfield_small" id="SCity" value="<%= SCity%>" size="35" maxlength="40" onchange="addUpdate('SCity')"/></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="28" align="right" class="Standard_Text">State:&nbsp;</td>
<td align="left"><select name="SState" size="1" class="inputfield_small" id="SState">
<option value=" ">-- Please Select a Shipping State --</option>
<%
statelist.movefirst
While (NOT statelist.EOF)
%>
<option value="<%=(statelist.Fields.Item("StateID").Value)%>"><%=(statelist.Fields.Item("StateID").Value)%></option>
<%
statelist.MoveNext()
Wend
%>
</select></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="36" align="right">Zip Code:</td>
<td class="Standard_Text" align="left"><input type="text" name="SZip" id="SZip" class="inputfield_small" size="15" maxlength="15" value="<%= SZip%>" onchange="addUpdate('SZip')"/></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">
<td height="12" colspan="4" align="right" nowrap><div align="left">
<div align="left">
<hr />
</div>
</div></td>
</tr>
<tr valign="baseline">
<td colspan="2" align="right" nowrap><div align="left"><span class="Header_1"><b>Event Order Details</b>&nbsp;&nbsp;&nbsp;</span></div></td>
<td align="right">&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr valign="baseline">


.....


</table>
</body>
</html>

Bill Posters
10-13-2008, 10:16 PM
There's no element with the id value of BAdd1.
Check yer case-sensitivity.


var badd1 = document.getElementById("BAdd1").value;


<input name="Badd1" type="text" class="inputfield_small" id="Badd1" value="" size="60" maxlength="75">

IE is more forgiving of bad code than FF.
FF is doing exactly what you're telling it to do and looking for exactly what you tell it to look for - and not finding it, because it's not there.

dariggy
10-14-2008, 06:52 AM
Bill,

Thank you for exposing my stupidity! I looked at those variables 100 times and never saw the letter case issue. Now my problem is solved and my form works beautifully. much appreciated.

Regards,
Steve