SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Hybrid View

  1. #1
    SitePoint Evangelist
    Join Date
    Jan 2002
    Posts
    420
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Getting Values from 40 Checkboxes

    Hi guys and gals,

    I am coding a quiz that will have 40 checkboxes that the user will be able to check.

    (Right now I am trying to get this code to work with 4 and will change it to 40 once I figure out my problem.)

    What I want to do is count up the amount of checked boxes and display it to the user.

    I know I could do this with copying and pasting a line of code over and over again, but I thought it would be much smarter to use a loop and cut the JS down to only a few lines.

    --A temporary file is set up at: http://design.suncitydesign.com/assets/AssetsJS.htm

    This is my JS code:
    Code:
    <script type="text/javascript">
    <!--
    
    function doIt(){
    
    var i = 0;
    var count = 0;
    var test = 'chk0';
    
    var item = new Array('chk0', 'chk1', 'chk2', 'chk3');
    
      for (i=0;i<=3;i++){
      
      if (document.app.item[i].checked == true){count+=1;}
      
      }
    
    alert("The count is: " + count);
    
    }
    
    //-->
    </script>
    When run I get an error: 'document.app.item[...].checked' is null or not an object.

    Does anyone know what I am doing wrong, I can't seem to figure it out, if it is even possible this way.

    Thanks,

    -Steve
    Wavelan

  2. #2
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Try this. This should work for 1 or 100 checkboxes.
    Code:
    function findCheckedBoxes(theForm) {
     var x = 0;
     var elems = theForm.elements;
    //loop through all of the form's controls
     for (var i = 0; i < elems.length; i++) {
    //see if the element in question is a checkbox
      if (elems[i].type=='checkbox') {
    //see if it's checked. if it is checked then
    //increment x by 1.
        if (elems[i].checked) {
          x += 1;
        }
       }
     }
     return x;
    }
    Use the function like this: (assume your form is named form1)
    Code:
    <input type="button" onclick="alert(findCheckedBoxes(document.form1));" value="Calculate!" />
    Hope this helps!

  3. #3
    SitePoint Evangelist
    Join Date
    Jan 2002
    Posts
    420
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks vgarcia,

    I found a different way of doing it.

    Code:
    <script type="text/javascript">
    <!--
    
    function doIt(){
    
    var i = 0;
    var count = 0;
    
    var item = new Array(4);
    
      for (i=0;i<=3;i++){
      
      if (document.app.chk[i].checked == true){count+=1;}
      
      }
    
    alert("The count is: " + count);
    
    }
    
    //-->
    </script>
    And in the HTML code I changed the name's to all be the same creating its on array, it's always the simplest things
    Wavelan


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •