I have a two page form, and am trying to pass data from page one to page two. I can get most of it to go, except the "Role" shown in the code below. The Department field controls which "Role" is selected, but when I try to send it to the next page is says "undefined" for the "Role" field. Here's my code:
Page1.htm:
<html>
<head>
<title>New User Request</title>
<script language="JavaScript">
function opwin(url) {
nwwin = window.open(url);
}
var prevRole = "";
function showRole(currRole){
if (prevRole != ""){document.getElementById(prevRole).style.display='none'}
if (currRole != 0)
{document.getElementById(currRole).style.display='inline';
prevRole=currRole}
}
function disableRoles(isForm){
selectedRole = isForm.Department.selectedIndex;
if (selectedRole == 1)
{
document.getElementById('101').disabled = true;
document.getElementById('110').disabled = true;
return true;
}
if (selectedRole == 2)
{
document.getElementById('100').disabled = true;
document.getElementById('110').disabled = true;
return true;
}
if (selectedRole == 3)
{
document.getElementById('100').disabled = true;
document.getElementById('101').disabled = true;
return true;
}
else {
alert('Please choose a department');
return false;
}
}
</script>
</head>
<body>
<h1>Online Request</h1>
<form name="NewUser">
<p><b>Your First Name: <input type="text" name="ufname" size="30"></b></p>
<p><b>Your Last Name: <input type="text" name="ulname" size="30"></b></p>
<select name="Department" onchange="showRole(this.value)">
<option value="0" selected>Choose a Department</option>
<option value="100">100 Corporate General</option>
<option value="101">101 Corporate Restructuring</option>
<option value="110">110 Merchandising General</option>
</select>
<select name="Role" id="100" style='display:none'>
<option value="D1_0000001">D1 Role 000001</option>
<option value="D1_0000010">D1 Role 000010</option>
<option value="D1_0000020">D1 Role 000020</option>
</select>
<select name="Role" id="101" style='display:none'>
<option value="D2_0000001">D2 Role 000001</option>
<option value="D2_0000010">D2 Role 000010</option>
<option value="D2_0000020">D2 Role 000020</option>
</select>
<select name="Role" id="110" style='display:none'>
<option value="D3_0000001">D3 Role 000001</option>
<option value="D3_0000010">D3 Role 000010</option>
<option value="D3_0000020">D3 Role 000020</option>
</select>
<p><input type="button" value="Page2" onClick="opwin('Page2.htm');"></p>
</form>
</body>
</html>
Page2.htm:
<html><head>
<title>New User Request Page 2</title>
<script language="JavaScript">
function gtvals() {
d = document.NewUser2;
o = opener.document.NewUser;
d.ufname.value = o.ufname.value;
d.ulname.value = o.ulname.value;
d.Department.value = o.Department.value;
d.Role.value = o.Role.value;
}
</script>
</head>
<body onLoad="gtvals();">
<form name="NewUser2" action="globalsendmail.asp" Method="Post">
<p>
<INPUT TYPE="hidden" id=hidden1 name="Subject Line" value="New Test!">
<INPUT TYPE="hidden" id=hidden2 name="To" value="email@address.com">
<INPUT TYPE="hidden" id=hidden3 name="CC" value="">
<INPUT TYPE="hidden" id=hidden4 name="Bcc" value="">
<INPUT TYPE="hidden" id=hidden5 name="Link_URL" value="Page1.htm">
</p>
<p><input type="text" name="ufname"></p>
<p><input type="text" name="ulname"></p>
<p><input type="text" name="Department"></p>
<p><input type="text" name="Role"></p>
<p><input type="submit" name="Submit" value="Submit"><input type="reset"
value="Reset"></p>
</form>
</body>
</html>
I know that having three form elements all named the same forms a control array, but I don't know how to reference the right one. Please help!
Page1.htm:
<html>
<head>
<title>New User Request</title>
<script language="JavaScript">
function opwin(url) {
nwwin = window.open(url);
}
var prevRole = "";
function showRole(currRole){
if (prevRole != ""){document.getElementById(prevRole).style.display='none'}
if (currRole != 0)
{document.getElementById(currRole).style.display='inline';
prevRole=currRole}
}
function disableRoles(isForm){
selectedRole = isForm.Department.selectedIndex;
if (selectedRole == 1)
{
document.getElementById('101').disabled = true;
document.getElementById('110').disabled = true;
return true;
}
if (selectedRole == 2)
{
document.getElementById('100').disabled = true;
document.getElementById('110').disabled = true;
return true;
}
if (selectedRole == 3)
{
document.getElementById('100').disabled = true;
document.getElementById('101').disabled = true;
return true;
}
else {
alert('Please choose a department');
return false;
}
}
</script>
</head>
<body>
<h1>Online Request</h1>
<form name="NewUser">
<p><b>Your First Name: <input type="text" name="ufname" size="30"></b></p>
<p><b>Your Last Name: <input type="text" name="ulname" size="30"></b></p>
<select name="Department" onchange="showRole(this.value)">
<option value="0" selected>Choose a Department</option>
<option value="100">100 Corporate General</option>
<option value="101">101 Corporate Restructuring</option>
<option value="110">110 Merchandising General</option>
</select>
<select name="Role" id="100" style='display:none'>
<option value="D1_0000001">D1 Role 000001</option>
<option value="D1_0000010">D1 Role 000010</option>
<option value="D1_0000020">D1 Role 000020</option>
</select>
<select name="Role" id="101" style='display:none'>
<option value="D2_0000001">D2 Role 000001</option>
<option value="D2_0000010">D2 Role 000010</option>
<option value="D2_0000020">D2 Role 000020</option>
</select>
<select name="Role" id="110" style='display:none'>
<option value="D3_0000001">D3 Role 000001</option>
<option value="D3_0000010">D3 Role 000010</option>
<option value="D3_0000020">D3 Role 000020</option>
</select>
<p><input type="button" value="Page2" onClick="opwin('Page2.htm');"></p>
</form>
</body>
</html>
Page2.htm:
<html><head>
<title>New User Request Page 2</title>
<script language="JavaScript">
function gtvals() {
d = document.NewUser2;
o = opener.document.NewUser;
d.ufname.value = o.ufname.value;
d.ulname.value = o.ulname.value;
d.Department.value = o.Department.value;
d.Role.value = o.Role.value;
}
</script>
</head>
<body onLoad="gtvals();">
<form name="NewUser2" action="globalsendmail.asp" Method="Post">
<p>
<INPUT TYPE="hidden" id=hidden1 name="Subject Line" value="New Test!">
<INPUT TYPE="hidden" id=hidden2 name="To" value="email@address.com">
<INPUT TYPE="hidden" id=hidden3 name="CC" value="">
<INPUT TYPE="hidden" id=hidden4 name="Bcc" value="">
<INPUT TYPE="hidden" id=hidden5 name="Link_URL" value="Page1.htm">
</p>
<p><input type="text" name="ufname"></p>
<p><input type="text" name="ulname"></p>
<p><input type="text" name="Department"></p>
<p><input type="text" name="Role"></p>
<p><input type="submit" name="Submit" value="Submit"><input type="reset"
value="Reset"></p>
</form>
</body>
</html>
I know that having three form elements all named the same forms a control array, but I don't know how to reference the right one. Please help!