Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Checkbox value issue

Status
Not open for further replies.

lastdonuk

Programmer
Jan 19, 2005
58
GB
I have a form with some conditional javascript code on a group of checkboxes:

link

If Option 1 or Option 2 are checked then Options 3,4, & 5 become enabled.

On submit, I want to pass the value of all checkboxes to another page, showing whether the option is checked or unchecked.

Previously, this code used the name element with a Request.Form on the 2nd page. My problem is that the javascript conditional code on the submitting page uses getElementsByName to do it's stuff, so I had to change the names of the individual checkboxes...

I can either change the function OR can I use the element id to return the value on the 2nd page? I've posted this thread on the javascript forum as well.

Any guidance would be great, here's the code for the submitting page, followed by the code for the page I'm submitting to:

Code:
<html>
<head>
<title>checkboxtastic</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="form_style.css">
<script type="text/javascript">
function oneOrNoCheckboxGroup(obj)
{	
    var checkboxGroup = document.getElementsByName(obj.name);
    var bchosen=false;

    for (var cb = 0; cb < checkboxGroup.length; cb++) {
        if (checkboxGroup[cb].checked) {
			bchosen=true;
            break;
        }
    }

    var checkboxGroup_derived = document.getElementsByName(obj.name + "_derived");
    if (bchosen) {
		for (var c = 0; c<checkboxGroup_derived.length; c++) {
            checkboxGroup_derived[c].disabled = false;
        }
    } else {
        for (var cx = 0; cx<checkboxGroup_derived.length; cx++) {
            checkboxGroup_derived[cx].checked = false;
            checkboxGroup_derived[cx].disabled = true;
        }
    }
}
</script>
</head>

<body>
<form action="checkbox2.asp" method="post" id="form1" name="form1">
    <table border="0" width="600">
        <tr class="an10" bgcolor="#EAD5EA">
              <td class="an10" bgcolor="#EAD5EA"><b><i>Either</i></b></td>
              <td class="an10" bgcolor="#EAD5EA">Option 1</td>
              <td align="left" class="an10" bgcolor="#EAD5EA"><input type="checkbox" name="opt" id="option1" onclick="oneOrNoCheckboxGroup(this);"></td>
        </tr>
        <tr class="an10" bgcolor="#EAD5EA">
              <td class="an10" bgcolor="#EAD5EA"><b><i>Or</i></b></td>
              <td class="an10" bgcolor="#EAD5EA">Option 2</td>
              <td align="left" class="an10" bgcolor="#EAD5EA"><input type="checkbox" name="opt" id="option2" onclick="oneOrNoCheckboxGroup(this);"></td>
        </tr>
          <tr class="an10" bgcolor="#EAD5EA">
              <td class="an10" bgcolor="#EAD5EA"></td>
              <td align="left" class="an10" bgcolor="#EAD5EA">Option 3</td>
              <td align="left" class="an10" bgcolor="#EAD5EA"><input type="checkbox" name="opt_derived" id="option3" disabled></td>
        </tr>
          <tr class="an10" bgcolor="#EAD5EA">
              <td class="an10" bgcolor="#EAD5EA"></td>
              <td align="left" class="an10" bgcolor="#EAD5EA">Option 4</td>
              <td align="left" class="an10" bgcolor="#EAD5EA"><input type="checkbox" name="opt_derived" id="option4" disabled></td>
        </tr>
          <tr class="an10" bgcolor="#EAD5EA">
              <td class="an10" bgcolor="#EAD5EA"></td>
              <td align="left" class="an10" bgcolor="#EAD5EA">Option 5</td>
              <td align="left" class="an10" bgcolor="#EAD5EA"><input type="checkbox" name="opt_derived" id="option5" disabled></td>
        </tr>
    </table>
	<br>
	<input type="submit" value="Submit" class="button" id="submit1" name="submit1">
</form>
</body>
</html>

Page 2:

Code:
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="form_style.css">
</head>
<body>
<table>
<%
if Request.Form("option1") = "Yes" then
  	opt1chk="Checked"
else 
  	opt1chk="Unchecked"
end if

if Request.Form ("option2") = "Yes" then
	opt1chk="Unchecked"
end if
%>
<tr><td>Option 1</td><td><%response.write(opt1chk)%></td></tr>
<%
if Request.Form ("option2") = "Yes" then
  	opt2chk="Checked"
else 
  	opt2chk="Unchecked"
end if
%>
<tr><td>Option 2</td><td><%response.write(opt2chk)%></td></tr>
<%
if Request.Form ("option3") = "Yes" then
  	opt3chk="Checked"
else 
  	opt3chk="Unchecked"
end if
%>
<tr><td>Option 3</td><td><%response.write(opt3chk)%></td></tr>
<%
if Request.form ("option4")= "Yes" then
  	opt4chk="Checked"
else 
	opt4chk="Unchecked"
end if
%>
<tr><td>Option 4</td><td><%response.write(opt4chk)%></td></tr>
<%
if Request.form ("option5") = "Yes" then
	opt5chk="Checked"
else 
  	opt5chk="Unchecked"
end if
%>
<tr><td>Option 5</td><td><%response.write(opt5chk)%></td></tr>
</table>
</body>
</html>

Thanks in advance,
Rob
 
1. You have not given the value "yes" to the check state. So the default checked value passed will be "on"

2. You should use the same names to catch Request.Form as you used in the 1st page.

3. I suggest use the getElementById in javascript, and give unique names to the checkboxes.

--------------
The Lord works in mysterious ways - and SysAdmins at mysterious hours
 
You can add the following in your checkbox2.asp right after <body> tag to see exactly what is being passed to the next page

<%=Request.Form%>

--------------
The Lord works in mysterious ways - and SysAdmins at mysterious hours
 
Thanks for your comments, I think option 3 is the way I'm gonna have to go - I hoped not since my javascript is, at best, basic...cheers for helping me out :)

Rob
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top