asked on

3 Checkboxes (A,B,C) on form, with 3 groups (AG, BG, CG) of other checkboxes - tick/untick all in corresponding group

Hi All,
I've got a web form, which has 3 checkboxes - A, B & C - and additionally, 3 seperate groups of checkboxes - AG, BG and CG. If checkbox A is ticked - I want, via javascript, all checkboxes in group AG only ticked - and unticked if checkbox A is unticked - and the same for B and C. I'm getting in a right muddle with this!
Hope you can help.
Regards
JamWales

Sudhindra A N

check this..

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title></title>
    <script type="text/javascript">
      function checkAll(v) {
        if(v.checked) {
          setValue(v,"checked");
        } else {
          setValue(v,"");
        }
      }
      
      function setValue(ob,val) {
        var obs=eval("document.testform."+ob.name+"G");
        var ln=obs.length;
        for(var i=0; i<ln;i++) {
          obs[i].checked=val;
        }
      }
    </script>
  </head>
  <body>
    <form name="testform">
        <table>
          <tr>
            <td width="100px">
              A &nbsp; <input type="checkbox" name="A" value="A" onclick="javascript:checkAll(this)" ><br><br>
              <input type="checkbox" name="AG" value="AG1" > AG1 <br>
              <input type="checkbox" name="AG" value="AG2" > AG2 <br>
              <input type="checkbox" name="AG" value="AG3" > AG3 <br>
            </td>
            <td width="100px">
              B &nbsp; <input type="checkbox" name="B" value="B" onclick="javascript:checkAll(this)" ><br><br>
              <input type="checkbox" name="BG" value="BG1" > BG1 <br>
              <input type="checkbox" name="BG" value="BG2" > BG2 <br>
              <input type="checkbox" name="BG" value="BG3" > BG3 <br>
            </td>
            <td width="100px">
              C &nbsp; <input type="checkbox" name="C" value="C" onclick="javascript:checkAll(this)" ><br><br>
              <input type="checkbox" name="CG" value="CG1" > CG1 <br>
              <input type="checkbox" name="CG" value="CG2" > CG2 <br>
              <input type="checkbox" name="CG" value="CG3" > CG3 <br>
            </td>
          </tr>
        </table>
    </form>
  </body>
</html>

Open in new window

Jamie

ASKER

Hi ansudhindra,

Many thanks for your quicky reply, it works well, just one little tweak if possible? Apologies, should have put that in - as all my form fields elements already have names and values which are already named in such a way for some other scripts I have running.

Rather than working for the name and values elements - could it work by ID

Regards

JamWales

ASKER CERTIFIED SOLUTION

Sudhindra A N

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

Jamie

ASKER

Hi ansudhindra,
Fantastic - works exactly as I want - many thanks for sorting this out so quickly.
Regards
JamWales