Error: f.PermissionID has no properties (whyyyyyyyy)

[2levelsabove]

<form method="post" action="javascript:void(0);" name="ShareOptionsForm" onsubmit="if (VerifyForm('ShareOptionsForm')) { AddShareJob(); HideShareOptions(); setTimeout('RefreshCart()', 1000); } else { return false; }">
            



            

		<p><label for="ContactID">Recipient</label><br />
		<select name="ContactID" id="ContactID" onChange="FadeOutError('RecipientError')">
		<option value="">Select a Recipient...</option>
		<?php
			if (isset($recipients) && !empty($recipients)) {
				foreach ($recipients as $recipient) {
					$recipientText = '';
					if (!empty($recipient['Company'])) {
						$recipientText = $recipient['Company'] . ' - ';
					}
					$recipientText .= "{$recipient['FirstName']} {$recipient['LastName']}"; /*  ({$recipient['Email']}) */
					print "<option value=\"{$recipient['ContactID']}\">{$recipientText}</option>\n";
				}
			}
		?>
		</select> or <input type="button" name="AddNewRecipient" id="AddNewRecipient" value="Add New Recipient" onclick="ShowShareNewRecipient();" /></p>
		<div id="RecipientError" class="error" style="display:<?php if (isset($RecipientError)) echo 'block'; else echo 'none'; ?>"><?php if (isset($RecipientError)) echo $RecipientError; ?> </div>
		<h2>Permissions</h2>

		<p>Permissions tell us how you want this recipient to be allowed to share these documents. Move the slider below to control the level of permissions.</p>

		<div id="PermissionExplanation" style="font-style:italic;font-weight:bold;text-align:center;width:500px;height:35px;"><p>This recipient will not be allowed to share these documents.</p></div>
<input type="hidden" name="PermissionID" value="1" />
    		

                       
               
            <input type="radio" name="permission" id="permission1" value="152" onclick="ChangePermissionGraphic(152)" />
                       
                            
            <input type="radio" name="permission" id="permission2" value="313" onclick="ChangePermissionGraphic(313)"/>
                                         
           
  <input type="radio" name="permission" id="permission3" value="466" onclick="ChangePermissionGraphic(466)"/>

		<p><img src="images/permission1.jpg" width="500" height="174" alt="Permissions" border="0" id="PermissionGraphic" /></p>

		<p>
		<input type="submit" name="Submit" value="Share These Documents" />   <input type="button" name="Cancel" value="Cancel" id="Cancel" onclick="HideShareOptions();" /></p>

		<script language="JavaScript" type="text/javascript">
		<!--
		// Script placed here because apparently problems crop up in IE otherwise.



			var Image1 = new Image();
			Image1.src = "images/permission1.jpg";
			var Image2 = new Image();
			Image2.src = "images/permission2.jpg";
			var Image3 = new Image();
			Image3.src = "images/permission3.jpg";


			function ChangePermissionGraphic(v) {

			//alert("test from slider");
				d = document; f = d.ShareOptionsForm;


				switch (v) {
					case 152:
						d.getElementById('PermissionGraphic').src = 'images/permission1.jpg';
						d.getElementById('PermissionExplanation').innerHTML = '<p>This recipient will not be allowed to share these documents.</p>';
						f.PermissionID.value = 1;
						break;
					case 313:
						d.getElementById('PermissionGraphic').src = 'images/permission2.jpg';
						d.getElementById('PermissionExplanation').innerHTML = '<p>This recipient will be allowed to share these documents with other people, but they will not be allowed to share the documents.</p>';
					f.PermissionID.value = 2;




						break;
					case 466:
						d.getElementById('PermissionGraphic').src = 'images/permission3.jpg';
						d.getElementById('PermissionExplanation').innerHTML = '<p>These documents can be shared with anybody.</p>';
						f.PermissionID.value = 3;
						break;
				}
			}


		//-->
		</script>

		</form>