check boxes - want to check/uncheck some

Dr Zoidberg · 2 Jul 2008 at 23:34

I have two groups of checkboxes on a page, one group is small the other is rather larger so i wanted to add a check/uncheck all option to the large group only.

Searched the net and found several javascript options to do this, tried a few but have a few problems.

All the functions i found work on the name of the checkbox, with all in the group needing the same name, or on the form id

form id
As everything in the page was in 1 form i added new form tags to the group of checkboxes (form in a form is that allowed?) and gave it an id, set this to the function, and it will not work.

name
all checkboxes need the same name and the function picks up on this.
Unless i am doing some thing very wrong all my checkboxes have different names which are needed to pass there individual values on when the submit button is clicked so these functions will not work either.

Am i passing the values incorrectly or is there another way of passing them so i can give them all the same name?

Or is there another way to add a check/uncheck all option to a group of boxes?

Does any of that make sense?

Thanks

HTMLHugo · 3 Jul 2008 at 00:14

you call them checkbox1,checkbox2 etc etc and then use a for loop to loop through them all and check them ?

using checkbox + loop iteration.checked etc etc

sorry bit too much to drink but i'll try and kocl up a code sampletommorow

marc2003 · 3 Jul 2008 at 00:19

Dr Zoidberg said:
name
all checkboxes need the same name and the function picks up on this.
Unless i am doing some thing very wrong all my checkboxes have different names which are needed to pass there individual values on when the submit button is clicked so these functions will not work either.

groups of check boxes are supposed to have the same name. it's the value that separates each one.....eg

Code:

<input type="checkbox" name="food[]" value="spam"> Spam
<input type="checkbox" name="food[]" value="bread"> Bread

edit: forgot the [] on food.... you need this to store multiple values in an array (assuming you're using php to process the form?). use

PHP:

print_r($_POST);

to debug your form input. all should become clear.

HTMLHugo · 3 Jul 2008 at 12:23

hmm yes indeed.

didnt spot that last night.

I am pathetic !

Dr Zoidberg · 3 Jul 2008 at 17:25

I had already tried giving them all the same name and different values but i fell over with the rest of what i am doing,

short bit of checkboxes

Code:

<input name="box1" type="checkbox" value="1" />
<input name="box2" type="checkbox" value="1" />
<input name="box3" type="checkbox" value="1" />

Then in the page the form is submitted to (in php)

Code:

$box1 = $_POST['box1'];
$box2 = $_POST['box2'];
$box3 = $_POST['box3'];

later

if($box1 == 1)
{
do stuff
}
if($box2 == 1)
{
do stuff
}
etc etc

I changed all of them to the same name and changed the values to 1 2 3 etc
and then changed the if() statement to if($box2 == 2) etc
But this failed
So i assume there must be another way of doing this when all checkboxes have the same name?

Unless i can make the results work with all the checkboxes having the same name i am not going to be able to make the check/uncheck all option work.

SimonCHere · 4 Jul 2008 at 09:56

Sorry I can't do it in PHP but in Javascript it's only option buttons that have to have the same name so the code is something like:

Code:

function fnDoChk(){
  for (i=0; i<document.form2.elements.length; i++) 
  { 
    el = document.form2.elements[i];
    if (el.type=="checkbox" && el.name.indexOf("chk")!=-1)
    {
      if (el.checked)
      {
        switch (el.name)
        {
          case 'chk1':
            alert('1 checked');
            break;    
          case 'chk2':
            alert('2 checked');
            break;
          default:
            alert(el.name +" checked");
        }
      }
    } 
  }
}

<body>
    <form id="form2" name="form2">
    <input type=checkbox name="chk1" value="1" />
    <input type=checkbox name="chk2" value="2" />
    <input type=checkbox name="chk3" value="3" />
    <input type=checkbox name="chk4" value="4" />
    <input type=checkbox name="chk5" value="5" />
    <input type=button id="btnSubmit1" value="Submit 1" onclick="fnDoChk();" />
    </form>
</body>