INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

Unchecking Checkboxes

Unchecking Checkboxes

(OP)
I wrote a simple function to uncheck a checkbox when the other is checked. If neither is selected, then I expected it to submit nothing but it is apparently submitting 0. I purposely didn't use radio buttons in order to be able to deselect both in a pair which can't be done with radio buttons and I did not want to add a third choice for null.

However, that's not the question I have. There are two pairs of checkboxes but I combined the function for both. If I select opt0 or opt2, opt1 or opt3 are deselected as expected but if I then try to select opt1 or opt3, nothing happens until I manually uncheck opt0 or opt2. Since I am a PHP programmer and rarely use JavaScript, I am at a loss as to the problem and I can't spot any typos so can someone suggest a cure? A second set of eyes looking it over would be most appreciated.

CODE --> JavaScript

<script type="text/javascript">
function setChecked(){
	var opt0 = document.getElementById("opt0");
	var opt1 = document.getElementById("opt1");
	var opt2 = document.getElementById("opt2");
	var opt3 = document.getElementById("opt3");
	if (opt0.checked){
	  opt1.checked = false;
	 } else if (opt1.checked){
	  opt0.checked = false;
	}
	if (opt2.checked){
	  opt3.checked = false;
	 } else if (opt3.checked){
	  opt2.checked = false;
	}
}
</script> 

The HTML is partially database-driven and includes:

CODE --> HTML/PHP

<label for="OffSite">Off Site:</label>
<?php $OffyesChecked = ($rowStaff['OffSite'] == 1) ? " CHECKED" : "";?>
<?php $OffnoChecked = ($rowStaff['OffSite'] == 0 && $rowStaff['OffSite'] != NULL) ? " CHECKED" : "";?>
<input type="checkbox" name="OffSite" id="opt1" value="1" <?=$OffyesChecked?> onclick="setChecked(this);">yes 
<input type="checkbox" name="OffSite" id="opt0" value="0" <?=$OffnoChecked?> onclick="setChecked(this);">no 

<label for="Club">Club:</label>
<?php $ClubyesChecked = ($rowStaff['Club'] == 1) ? " CHECKED" : "";?>
<?php $ClubnoChecked = ($rowStaff['Club'] == 0 && $rowStaff['OffSite'] != NULL) ? " CHECKED" : "";?>
<input type="checkbox" name="Club" id="opt3" value="1"<?=$ClubyesChecked?> onclick="setChecked(this);">yes 
<input type="checkbox" name="Club" id="opt2" value="0"<?=$ClubnoChecked?> onclick="setChecked(this);">no 

RE: Unchecking Checkboxes

should they not be radio boxes not checkboxes?
and i wonder whether you mean to use the click event rather than the blur or onchange event? i suspect that's the issue as the click event happens before the value changes.

RE: Unchecking Checkboxes

(OP)
No, as I tried to describe to avoid the question even coming up, I do not want radio buttons because once selected, they cannot be deselected and I do not want to have a third choice for no selection. I'm talking about clicking the check box, not the JavaScript functionality when checked. It is this functionality where I need the help as I rarely if ever write JavaScript and know very little about it. If you can suggest better code, I am ready, willing and able to give it a try!

RE: Unchecking Checkboxes

so the options for offsite are no or yes or nothing?

likewise 'club'?

thus not answering either question is a valid response?

RE: Unchecking Checkboxes

(OP)
Yes, that's correct. I want no, yes or nothing. Nothing (neither checked in a pair) is supposed to make the field be NULL, while no makes it 0 and yes makes it 1. The default for the database field is also NULL. Therefore, it is also correct that answering neither is a valid response.

RE: Unchecking Checkboxes

I think the issues is more your un-checking logic.   When you try to check say opt1 when opt0 is already checked what happens.

Your first if statement evaluates to true.  Since opt0 is currently checked opt1 is set to false overriding your manual checking of the checkbox.

You need to alter your logic a bit. And use the onchange event instead of onclick. So the logic happens after the value has been set for the clicked-on checkbox.

CODE


function setChecked2(boxObj)
{
    var opt0 = document.getElementById("opt0");
    var opt1 = document.getElementById("opt1");
    var opt2 = document.getElementById("opt2");
    var opt3 = document.getElementById("opt3");
        //check to see if the activated object was checked. If it was unchecked you do not need to do anything
    if(boxObj.checked)
    {
                //Check which box was checked and uncheck the other one.
        if(opt0 == boxObj)
        {
            opt1.checked=false;        
        }
        else if(opt1==boxObj)
        {
            opt0.checked=false;
        }
        else if(opt2 == boxObj)
        {
            opt3.checked=false;        
        }
        else if(opt3==boxObj)
        {
            opt2.checked=false;
        }
    }

    
}





----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 

RE: Unchecking Checkboxes

(OP)
I described in my original question what happens when I check or uncheck boxes but it wasn't very clear so here is a clarification:

If I select opt0, opt1 is deselected as expected but if I then try to select opt1 again, nothing happens until I manually uncheck opt0.

Similarly, if I select opt2, opt3 is deselected but if I then try to select opt3 again, nothing happens until I manually uncheck opt2.

In any event, your code with the revised logic and the suggestion to change from onclick() to onchange() solved the immediate problem. Thank you!

RE: Unchecking Checkboxes

Quote:

If neither is selected, then I expected it to submit nothing but it is apparently submitting 0
If "unchecked", check box elements do not pass a value when submitted, it must be your collection routine that is making it into a zero.

Chris.

Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.
Webmaster Forum

RE: Unchecking Checkboxes

(OP)
Thank you and yes, I know, but as it is a PHP issue and this is the JavaScript forum, I didn't pursue it here. I'll post the question in the appropriate forum.

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close