Why is the first checkbox working but not the second?

Why is the first checkbox working but not the second, what am I doing wrong? :S

 <meta http-equiv="Content-type" value="text/html; charset=UTF-8" />

 <script type="text/javascript" language="javascript">
 function SetAllCheckBoxes(FormName, AreaID)
 {

 if(!document.forms[FormName])
 return;
 var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
 if(!objCheckBoxes)
 return;
 var countCheckBoxes = objCheckBoxes.length;
 if(!countCheckBoxes)
 objCheckBoxes.checked = CheckValue;
 else
 for(var i = 0; i < countCheckBoxes; i++)
 objCheckBoxes[i].checked = false;
 }
 </script>


 </head>

 <div id="items">
  <input name="checkall" type="checkbox" onclick="SetAllCheckBoxes('SelectedItems','items');"><br>
 <form name="SelectedItems" action="" method="post">
 <b>Select/Unselect All</b><br>


 <input id="idGSSmodules" type="checkbox" name="GSS" >
 <label for="idmodules">GSS</label><br>
 <input type="checkbox" name="GTS" id="idGSSmodules">
 <label for="idmodules">GSS</label>
 <br>

 </div>

 <div id="itemss">
  <input name="checkall" type="checkbox" onclick="SetAllCheckBoxes('SelectedItemss','itemss');"><br>
 <form name="SelectedItemss" action="" method="post">
 <b>Select/Unselect All</b><br>


 <input id="idGSSmodules" type="checkbox" name="GSS" >
 <label for="idmodules">GSS</label><br>
 <input type="checkbox" name="GTS" 开发者_高级运维id="idGSSmodules">
 <label for="idmodules">GSS</label>
 <br>

 </div>

 </form>

 </body>
 </html>

EDIT**************************************************************

How do I call the method on the form SetAllCheckBoxes(FormName, AreaID); In other words I would like to call the function whithout using a checkbox?

Tried this, but then I cant change the value of the checkboxes

 function unCheckBoxes(FormName, AreaID) {
     if(!document.forms[FormName])
     return;
     var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
     if(!objCheckBoxes)
     return;
     var countCheckBoxes = objCheckBoxes.length;

     for(var i = 0; i < countCheckBoxes; i++)
     objCheckBoxes[i].checked = false;
 }
 function checkCheckBoxes(FormName, AreaID){
     if(!document.forms[FormName])
     return;
     var objCheckBoxes = document.getElementById(AreaID).getElementsByTagName('input');
     if(!objCheckBoxes)
     return;
     var countCheckBoxes = objCheckBoxes.length;


     for(var i = 0; i < countCheckBoxes; i++)
     objCheckBoxes[i].checked = true;
 }
checkCheckBoxes('locForm','locCheckboxes');

---

Of the input elements checkboxes only have the checked property, use this and all checkboxes on your page will be set to the same value of your clicked checkbox.

function setAllOtherCheckboxes(checkAllbox)
{
    var objCheckBoxes = document.getElementsByTagName('input');

    var chkBox = 0;
    for (chkBox in objCheckBoxes)
    {
        objCheckBoxes[chkBox].checked = checkAllbox.checked;            
    }       
}     

and in your code:

<input type="checkbox" name="All" value="on"" onclick="setAllOtherCheckboxes(this);">Alles<br>

---

Your two checkboxes have the same id, which is the true unique identifier (not name). The browser refuses to recognize two objects with the same id.

Change your code to:

<input id="GSS" type="checkbox" name="GSS">
<label for="GSS">GSS</label><br/>
<input type="checkbox" name="GTS" id="GTS">
<label for="GTS">GSS</label> 

EDIT: You will need to rename your second set of checkboxes to unique names, also. Each id on the page must be unique.