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 Wanet Telecoms Ltd 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 ASP 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
 
Are you were aware that if you don't check a checkbox then it (and it's value) will not be submitted as part of the form submit?

As a result, you would have to find another way (hidden fields?) to store the values and then test these hidden fields for your server-side code.

You have given unique ids to the checkboxes... but you must be aware that the ID is never sent as part of the form submission. You should be using the name of the checkbox server-side to access it's value.

You currently have 2 unique checkbox names. You have 5 checkboxes. This is wrong. Maybe you mean to use radio buttons? Regardless... your HTML will not validate and as a result you will get unexpected results.

I suggest you give each of your checkboxes the same name as you have id. Then you will need to modify your server-side code to check to each if the checkbox value was sent (for a specific named checkbox)... if it was... then the checkbox was checked... if the checkbox was not sent... then the checkbox was not checked in the previous page.

Does this make any sense to you?

Cheers,
Jeff

[tt]Jeff's Page [/tt][tt]@[/tt][tt] Code Couch
[/tt]
 
Jeff,

Thanks for your response - you've answered some of my questions in that, I really wanted to know if you COULD send the ID as part of a form submit, I didn't think so but hoped I could...

Also, know I've got the problem of having 5 checkboxes with 2 different names - this was to get the javascript working, before I realised I needed to pass the values to the proceeding page.

The DB will simply update any options where the value is 'yes' to 'yes' and leave others NULL, that's not a problem by the way, but thanks for your advice there.

I guess what you're saying is I'll need to change the function if I want to pass the input data through on the submit OR maybe use radio buttons for options 1 & 2 and checkboxes for 3,4 & 5?

Thanks very much for helping me out with your comments.

Rob
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top