Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Cycle through checkboxes on a form and determine if at least one has been checked

Posted on 2004-10-25
4
Medium Priority
?
638 Views
Last Modified: 2012-06-27
I have a form with 3 checkboxes.  I need the button to be disabled until the user clicks one of the boxes, at which point it will become enabled.  If the user clicks a checkbox, and then clicks again (un-checking it), i need to cycle through all the checkbxes to see whether or not one is still checked in order to set the correct state of the buttons.  What I cant figure out is the javacript syntax to check the value of all the checkboxes in a form after an onClick event, or something similar?

<form name="form1">

<input type="checkbox" value="1">1
<input type="checkbox" value="2">2
<input type="checkbox" value="3">3

<input type="button" disabled value="Go">
</form>
0
Comment
Question by:soBC
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 12

Expert Comment

by:minichicken
ID: 12402908
<script language = "javascript">
function chkbutton()
{
      if (form1.chk1.checked == true || form1.chk2.checked == true || form1.chk3.checked == true)
      {
            form1.thebutton.disabled = false;            
      }
      else
      {
            form1.thebutton.disabled = true;
      }
}
</script>
<form name="form1">

<input name ="chk1" type="checkbox" value="1" onclick ="chkbutton();">1
<input name ="chk2" type="checkbox" value="2" onclick ="chkbutton();">2
<input name ="chk3" type="checkbox" value="3" onclick ="chkbutton();">3

<input name ="thebutton" type="button" disabled value="Go">
</form>
0
 

Author Comment

by:soBC
ID: 12402962
Ah...i have one more condition actually.  The number of checkboxes may not always be 3.  I need to account for that variation.  Thanks for the sample though.  It'll work fine statically, but Im not sure how I'd modify it to handle dynamically generated lists of checkboxes...
0
 
LVL 3

Accepted Solution

by:
nan1217 earned 1400 total points
ID: 12403124
Loop through all form elements but add this

if (form1[i].type == "checkbox")

and then only work with those that evaluate as true.  So it would look something like this (code is untested):

<script language="JavaScript" type="text/javascript">
function uncheck(form) {
var i;
var formElements = form.elements;

for (i=0; i<formElements.length; i++) {  //loop through form elements
     if (formElements[i].type == "checkbox") {  //test for only checkbox items
          if (formElements[i].checked) {  //test if element is checked
               form1.thebutton.disabled = true;  //uncheck
          }
     }
}
}
</script>
0
 
LVL 12

Expert Comment

by:minichicken
ID: 12403296
<script language = "javascript">
function chkbutton()
{
      document.form1.thebutton.disabled = true;
      
      for(var i=0; i< document.form1.elements['chk[]'].length;i++)
      {
            if(document.form1.elements['chk[]'][i].checked)
            {
                  document.form1.thebutton.disabled = false;
            }
      }
}



</script>
<form name="form1">

<input name ="chk[]" type="checkbox" value="1" onclick ="chkbutton();">1
<input name ="chk[]" type="checkbox" value="2" onclick ="chkbutton();">2
<input name ="chk[]" type="checkbox" value="3" onclick ="chkbutton();">3

<input name ="thebutton" type="button" disabled value="Go">
</form>
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Dramatic changes are revolutionizing how we build and use technology. Every company is automating, digitizing, and modernizing operations. We need a better, more connected way to work together as teams so we can harness the insights from our system…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The is a quite short video tutorial. In this video, I'm going to show you how to create self-host WordPress blog with free hosting service.
Suggested Courses

636 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question