JavaScript - Fill In Form Field In Another Html Page

<input type="hidden" name="rtrn" value="http://www.domain.com/thanks.html" target="_parent">

<script type = "text/javascript">

var allprices = [];
var index = 0;

function chkrads(frmName,rbGroupName) {
var chosen = "";
var radios = document[frmName].elements[rbGroupName]; 
for (var i=0; i <radios.length; i++) { 
if (radios[i].checked) { 
chosen = radios[i].value;
} 
}



if (chosen == 0) {printprice = 0}

if (chosen == 1) {printprice = 99}
if (chosen == 2) {printprice = 150}
if (chosen == 3) {printprice = 250}

if (chosen == 21) {printprice = 200}
if (chosen == 22) {printprice = 300}

if (chosen == 30) {printprice = 50}

if (chosen == 41) {printprice = 50}
if (chosen == 42) {printprice = 70}
if (chosen == 43) {printprice = 90}


if (rbGroupName == "size") {index = 0}
if (rbGroupName == "colour") {index = 1}
if (rbGroupName == "frame") {index = 2}
if (rbGroupName == "glass") {index = 3}
if (rbGroupName == "hook") {index = 4}
if (rbGroupName == "delivery") {index = 5}

allprices[index] = printprice;

var totalprice = 0;
for (var i =0; i <allprices.length; i++) {
if (!isNaN(allprices[i])) {
totalprice = totalprice + allprices[i];
}
}

document.getElementById("result").style.display = "block";
document.getElementById("result").innerHTML = totalprice;


}
</script>

 <form name= "myform" style="font-size:11px; font-family:Arial, Helvetica, sans-serif;">

<input type = "radio" name = "size" value = "0" onclick = "chkrads('myform', 'size')"> <b>0</b>
<input type = "radio" name = "size" value = "1" onclick = "chkrads('myform', 'size')"> <b>1</b>
<input type = "radio" name = "size" value = "2" onclick = "chkrads('myform', 'size')"> <b>2</b>
<input type = "radio" name = "size" value = "3" onclick = "chkrads('myform', 'size')"> <b>3</b>

<br /><br /><br /><br />

<input type = "radio" name = "colour" value = "0" onclick = "chkrads('myform', 'colour')"><b>No</b>
<input type = "radio" name = "colour" value = "21" onclick = "chkrads('myform', 'colour')"><b>black</b>
<input type = "radio" name = "colour" value = "22" onclick = "chkrads('myform', 'colour')"><b>Multi Colour</b>

<br /><br /><br /><br />

<input type = "radio" name = "frame" value = "0" onclick = "chkrads('myform', 'logo')"><b>No</b>
<input type = "radio" name = "frame" value = "30" onclick = "chkrads('myform', 'logo')"><b>Yes</b>


<br /><br /><br /><br />

<input type = "radio" name = "glass" value = "0" onclick = "chkrads('myform', 'glass')"><b>No</b>
<input type = "radio" name = "glass" value = "51" onclick = "chkrads('myform', 'glass')"><b>Yes</b>

<br /><br /><br /><br />

<input type = "radio" name = "hook" value = "0" onclick = "chkrads('myform', 'hook')"><b>0</b>
<input type = "radio" name = "hook" value = "41" onclick = "chkrads('myform', 'hook')"><b>1</b>
<input type = "radio" name = "hook" value = "42" onclick = "chkrads('myform', 'hook')"><b>2</b>
<input type = "radio" name = "hook" value = "43" onclick = "chkrads('myform', 'hook')"><b>3</b>

<br /><br /><br /><br />

<input type = "radio" name = "delivery" value = "0" onclick = "chkrads('myform', 'delivery')"><b>No</b>
<input type = "radio" name = "delivery" value = "61" onclick = "chkrads('myform', 'delivery')"><b>Yes</b>

</form>

<div id="result" style="display:none;"><strong></strong> <span id="totalprice"></span> </div>

<form id="ContactForm" method="post" action="FormToEmail.php"  class="input2">

<label>Name: <input name="name" type="text" id="name" value="" size="" maxlength="80" class="input"/></label>

<br /><br />

<label>QUOTED PRICE: <input name="QUOTED PRICE" type="text" id="QUOTED PRICE" value="" size="" maxlength="80" class="input"/></label>

<br /><br />

<label>
<input type="submit" class="submit" name="submit" id="submit" value="submit"/>
</label>
</form>

....
<script type="text/javascript">
	window.onload = function() {
		document.forms[0].username.focus();
	}
	function validate(form)
	{
		var form = document.getElementById("reg");
		var e = document.getElementById("error");
		e.style.background = "red";
		
		for(var i = 0; i < form.elements.length; i++)
		{
			var el = form.elements[i];
			if(el.type == "text" || el.type == "password")
			{
				if(el.value == "")
				{
					e.innerHTML = "Please fill in all fields!";
					el.style.border = "1px solid red";
					el.focus();
					return false;
				} else {
					el.style.border = "1px solid green";
					return false;
				}
			}
		}
		var un = form.username;
		un.value = un.value.replace(/^\s+|\s+$/g,"");
		if((un.value.length < 3)|| (/[^a-z0-9\_]/gi.test(un.value)))
		{
			e.innerHTML = "Only letters,numbers and the underscore are allowed (no spaces) - 3-16 characters";
			un.focus();
			return false;
		}
		var pw = form.password;
		pw.value = pw.value.replace(/^\s+|\s+$/g,"");
		if((pw.value.length < 3) || (/[^a-z0-9]/gi.test(pw.value)))
		{
			e.innerHTML = "Only letters and numbers are allowed (no spaces) - 3-16 characters";
			pw.focus();
			return false;
		}
		e.innerHTML = "You filled in all the fields, well done!";
		e.style.background = "green";
		return false;
	}
</script>
</head>

<body>
<div id="wrapper">
	<div id="header">
    	<h1>My Cool Website</h1>
    </div>
    <div id="content">
		<div class="padding">
       	  <h2>Registration</h2>
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p>
<form id="reg" action="#" method="post" onsubmit="return validate(this)">
	    <div id="error"></div>
		<div><label for="username">Username</label></div>
    			<div><input type="text" name="username" id="username" size="30" maxlength="16" /></div>
		<div><label for="password">Password</label></div>
    			<div><input type="password" name="password" id="password" size="30" maxlength="16" /></div>
        <div><label for="c_password">Confirm Password</label></div>
                <div><input type="password" name="c_password" id="c_password" size="30" maxlength="16" /></div>
        <div><label for="email">Email address</label></div>
                <div><input type="text" name="email" id="email" size="30" maxlength="200" /></div>
        <div><label for="c_email">Confirm Email address</label></div>
                <div><input type="text" name="c_email" id="c_email" size="30" maxlength="200" /></div>
        <div><label for="firstname">First name</label></div>
                <div><input type="text" name="firstname" id="firstname" size="30" maxlength="100" /></div>
        <div><label for="surname">Surname</label></div>
                <div><input type="text" name="surname" id="surname" size="30" maxlength="100" /></div>
        <div><label for="gender">Gender</label></div>
                <div>
                    <div><input type="radio" name="gender" id="gender" value="m" checked="checked" />Male</div>
                    <div><input type="radio" name="gender" value="f" />Female</div>
                </div>
                <div><input type="submit" value="Register" name="submit" /></div>
          </form>
		</div>
    </div>
    <div id="footer">
    	<p>Copyright &copy; 2009 My Cool Website</p>
    </div>
</div>
</body>
</html>

<script language="javascript">

fields = 1;

function addMore() {

if (fields = 1) {

document.getElementById('addedMore').innerHTML = "<input type='text' name='field2' size='25' /> <span>Field 2.</span>";

fields = 2;

} else if (fields = 2) {

document.getElementById('addedMore').innerHTML = "<input type='text' name='field3' size='25' /> <span>Field 3.</span>";
fields = 3;

} else {

document.getElementById('addedMore').innerHTML = "Only 3 fields are allowed.";
document.form.add.disabled=true;

}

}

</script>

<input type="text" name="field1" size="25" /> <span>Field 1.</span>
<div id="addedMore"></div>
<p class="addMore"><form name="add"><a onclick="addMore()">Add another field.</a></form></p>

href="index2.php?q=4&id=+document.theForm.lists.value+&picklist"

<script type="text/JavaScript">

function textCounter1(field,counter,maxlimit,linecounter) {
	// text width//
	var fieldWidth = 137;
	var charcnt = field.value.length;        

	// trim the extra text
	if (charcnt > maxlimit) { 
		field.value = field.value.substring(0, maxlimit);
	}

	else { 
	// progress bar percentage
	var percentage = parseInt(100 - (( maxlimit - charcnt) * 100)/maxlimit) ;
	document.getElementById(counter).style.width =  parseInt((fieldWidth*percentage)/100)+"px";
	document.getElementById(counter).innerHTML="Limiet: "+percentage+"%"
	// color correction on style from CCFFF -> CC0000
	setcolor(document.getElementById(counter),percentage,"background-color");
	}
}

function setcolor(obj,percentage,prop){
	obj.style[prop] = "rgb(80%,"+(100-percentage)+"%,"+(100-percentage)+"%)";
}

</script>

 ((fieldWidth*percentage)/100)+"px";
	document.getElementById(counter).innerHTML="Limiet: "+percentage+"%"