Check box & hidden field

Forum Moderators: open

Message Too Old, No Replies

Check box & hidden field

bshaffer

7:34 pm on Apr 22, 2009 (gmt 0)

How can I input a value to a hidden field when a check box is checked then blank if unchecked ?

<input type="checkbox" class="style11"id="chkbox" name="chkbox">Yes

thanks

holyhttp

7:49 pm on Apr 22, 2009 (gmt 0)

if(document.myform.chkbox.checked){
document.myform.chkbox.submode.value='NEED THIS TO SAY PERIODIC';
}
else{
document.myform.chkbox.submode.value='';
}

Where myform is the name of the form those fields belong to

bshaffer

8:08 pm on Apr 22, 2009 (gmt 0)

Perfect!Thanks

bshaffer

9:33 pm on Apr 22, 2009 (gmt 0)

Actually I did some testing and it does not work

if(document.chkbox.checked){
document.chkbox.submode.value='periodic';
}
else{
document.chkbox.submode.value='';
}

any ideas?

rocknbil

10:19 pm on Apr 22, 2009 (gmt 0)

1. Since you are using an ID on the form element, which is preferred, don't use the old school methods of document.formname.elementname.

2. Your version is slightly different than holyhttp's, which is why it's not working. :-) Compare, if you like to pursue the why's.

3. Minor, note the spaces I've added between attributes compared to yours (should still work though.)

4. Move your events to external attachments onLoad, so your document is not cluttered up with onClicks, onMouseovers, and other white noise. You can then safely move them into an external document for even cleaner HTML.

5. Remember, if JS is disabled this won't work, so duplicate on the server side.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"  
"http://www.w3.org/TR/1998/REC-html40-19980424/loose.dtd"> 
<!-- Doctype ALL ON ONE LINE --> 
<html lang="en"> 
<head> 
 <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
<title>Untitled</title> 
<script type="text/javascript"> 
window.onload=function() { 
 if (document.getElementById('chkbox')) { 
 document.getElementById('chkbox').onclick=function() { populateHidden(this.checked); }; 
 } 
}; 
function populateHidden(isChecked) { 
 if (document.getElementById('submode')) { 
 document.getElementById('submode').value=(isChecked==true)?'PERIODIC':''; 
 // Remove the below after verifying it works 
 alert("hidden is->" + document.getElementById('submode').value); 
 } 
} 
</script> 
</head> 
<body> 
<form action=""> 
<input type="checkbox" class="style11" id="chkbox" name="chkbox">Yes 
<input type="hidden" name="submode" id="submode" value="NEED THIS TO SAY PERIODIC">  
</form> 
</body> 
</html>

DrDoc

11:51 pm on Apr 22, 2009 (gmt 0)

Scratch that altogether and go for something like this:

<input type="checkbox" name="submode" value="PERIODIC"> Yes

Tadaa! Problem solved ;)

bshaffer

1:09 pm on Apr 23, 2009 (gmt 0)

You did it again RocknBil! Thanks it works perfectly

rocknbil

2:19 pm on Apr 23, 2009 (gmt 0)

Tadaa! Problem solved ;)

Totally agree . . . don't know why you need a hidden field when the checkbox value should do it . . .

bshaffer

2:41 pm on Apr 23, 2009 (gmt 0)

<input type="checkbox" name="submode" value="PERIODIC"> Yes

I had it that way but every time the form was submitted linkpoint thought it was recurring if the box was check or not. But RocknBil's code worked flawlessly... so thanks for everyone's help.

rocknbil

3:22 pm on Apr 23, 2009 (gmt 0)

Well, if it's solved it's solved . . . but what's really odd is that if a checkbox is not checked it's value is not present in post or get, for any language I've worked with.

DrDoc

5:17 am on Apr 24, 2009 (gmt 0)

The difference being that using a hidden field with a blank value, you will at least get that parameter passed.

So, in reality, it should be a radio selection (or select dropdown):

Recurring:<br>
<input type="radio" name="submode" value=""> No<br>
<input type="radio" name="submode" value="PERIODIC"> Yes<br>