How to locate certain checkboxes

benton · 12-27-2008, 06:42 PM

I have a form that dynamically creates checkboxes. I want to put a checkbox above those so that the user can click on it to check/uncheck all of them at once. But I can't figure out how to find the checkboxes. Here's what I am trying to do:

This creates the single checkbox that I want to click to toggle all the others.

PHP Code:


			
<input type="checkbox" name="checkall" onclick="ChangeCheckStatus();">

Later in the form is the code to create the individual checkboxes.

PHP Code:


			
for ($i = 0; $i < $some_variable; ++$i)

{

  <input type="checkbox" name="checkall_"<?php echo $i; ?>">

}

I know I will need to do a loop to see them all but I used the following just to see if the basic code is working. But when I click on the main checkbox, nothing is displayed. If I change the alert to alert(elm.length);, it displays the total number of input form elements, as expected. Would someone please point out my mistake or let me know if there is a better way to do this?

HTML Code:

<script type="text/javascript">
function ChangeClickedStatus()
{
 var elm = document.getElementsByTagName("input");
 alert(elm[0].name);
}
</script>

benton · 12-30-2008, 04:01 AM

I was finally able to figure this one out and thought I would post the result here in case others need such a solution. The argument is the name of the main checkbox.

HTML Code:

function ChangeClickedStatus(boxname)
{
  var ison = document.getElementsByName(boxname)[0].checked; 
  var elm = document.getElementsByTagName("input");

  for (j = 0; j < elm.length; j++) 
  {
    if (elm[j].type == 'checkbox')
    {
      if (elm[j].name.search(boxname + "_") == 0)
      {
         if (ison == true)
           elm[j].checked = true;
         else
           elm[j].checked = false;
      }
    } 
  }     
}

CoryMathews · 12-30-2008, 05:04 AM

quite a handy function thanks for the post.

benton · 01-08-2009, 07:16 PM

Thanks. I'm pleased to be able to give something back to this great site, which has helped me a number of times.

Wildhoney · 01-08-2009, 11:04 PM

Thanks a lot

It's certainly very useful to implement this on any site that has many checkboxes. Also, I like Gmail's approach of holding down shift and clicking the first and last checkbox, and it fills in all the rest between. That's very useful.