PDA

View Full Version : Error trying to access form properties


3D_Dog_Man
08-24-2005, 08:10 AM
Hi Everyone,

I intend on displaying the size of stock items that are being displayed on my web pages. I intend on presenting the size of items in centimeters by default, but my web pages also have a drop down list that presents the opportunity to view the size of stock items in inches. My intention is to "dynamically" set the contents of two uneditable text inputs (one each for item height and width).

Initially when the page loads I am attempting to use the following javascript to enter details into the uneditable text inputs (this script information is in the <head> section of the document).

var height = document.forms['unitsForm'].imageHeight;
height.value = cmLength;

In addition my html markup for the <form> looks like so:

<form id="unitsForm" name="unitsForm">
<tr>
<td><table cellpadding="0" cellspacing="0">
<tr align="center">
<td><img src="../pictures/up_arrow.gif" height="20" width="20"></td>
</tr>

<tr align="center">
<td><img src="../pictures/vertical_block.gif" height="60" width="20"></td>
</tr>
<tr align="center">
<td><input id="imageHeight" maxlength="5" name="imageHeight" size="5" type="text" onchange="" readonly></td>
</tr>
<tr align="center">
<td><img src="../pictures/vertical_block.gif" height="60" width="20"></td>
</tr>

<tr align="center">
<td><img src="../pictures/down_arrow.gif" height="20" width="20"></td>
</tr>
</table></td>
<td><img src="../pictures/S2_70G2D.jpg" height="349" width="293"></td>
</tr>
<tr align="center">
<td>&nbsp;</td>
<td>

<table cellpadding="0" cellspacing="0">
<tr align="center">
<td><img src="../pictures/left_arrow.gif" height="20" width="20"></td>
<td><img src="../pictures/horizontal_block.gif" height="20" width="60"></td>
<td><input id="imageWidth" maxlength="5" name="imageWidth" size="5" type="text" onchange="" readonly></td>
<td><img src="../pictures/horizontal_block.gif" height="20" width="60"></td>
<td><img src="../pictures/right_arrow.gif" height="20" width="20"></td>
</tr>
</table>

</td>
</tr>
<tr align="center">
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr align="center">
<td>&nbsp;</td>
<td><span class="black_verdana_text">Units:</span>

<select name="determineUnits" class="black_verdana_text" id="determineUnits">
<option>Centimeters</option>
<option>Inches</option>
</select>
</td>
</tr>
</form>

The error message that I get from the javascript "console" in FireFox looks like so:

Error: document.forms.unitsForm has no properties

If anybody has any suggestions concerning how I can gain my desired funtionality they will be greatly appreciated.

Kind Regards

Davo

Kor
08-24-2005, 09:25 AM
u should use the onload event to make sure that all the page's elements are loaded before, and also you need a function which should change dynamically something on your page.

<script type="text/javascript">
function foo(){
....do something
}
onload=foo
</script>

or

<script type="text/javascript">
onload = function (){
....do something
}
</script>

3D_Dog_Man
08-26-2005, 04:22 AM
Hey Guys,

Thanks for your input, I now have the script functioning.

Kind Regards

Davo