Dynamically check/tick the related check boxes whenever one of it's group is checked

Imagine if you have multiple groups of check boxes and inside the group it self contain multiple check boxes. The user want if they select one check box , all the check boxes in the same group will be checked.So the same thing happen when the user unchecked the check box.It will ensure that all the member in the group will be checked or unchecked.(Just wondering why they don't to use radio button, only one for one group??!!Maybe they have the reason, and I forgot ..)

With my brain damage, I stayed up till 2.00 am plus because I cannot find it in Google.Surely got somewhere in Google but maybe I didn't type the correct keywords.

So at last, after trying and modifying then I got the result.If you find it useful then, enjoy !

function checkGroup(str,field) {
 
     var fieldid;
     var criteria;
     var checkedValue=str.checked
           str=str.value;


 /*this gets the information we want to evaluate,i put substring because I name the checkbox with the  group id and    follow by increment_number for example 44411000-111888-1_1. The first 17 character is group id, so i use this   group id to identify which group the checkbox fall into */
  
   criteria = str.substring(0,17); 
 
  for (i=0; i<field.length; i++) {
          fieldid = field[i].value;
       if (fieldid.substring(0,17)==criteria) {
         field[i].checked = checkedValue;
       }
    
   }
}//checkGroupClaim

It called by:

<html:checkbox name="myForm" property="strCheck" value="<%=strIndex1.toString()%>" id="<%=strIndex1.toString()%>"  onClick="checkGroup(this,document.myForm.strCheck)"/>