1. In the below page the Checkbox checked values should be maintained as comma separated values.
2. If select all checkbox at the top is clicked all the checkbox in that column should be marked as clicked.
3. In the same way if all individual checkbox are selected the select All checkbox should be Marked as Clicked.

function changeInvestmentIds(pThis) 
{   	
    	if($(pThis).is(":checked"))
    	{	
      	      //Hidden variable which stores the CSV values of Checkbox
  	      if($('#csvSelectedInvestmentIds').val() != '')    	  
  	    	 arrInvstIds = $('#csvSelectedInvestmentIds').val().split(',');	
    		
	       arrInvstIds.push($(pThis).val());
	      
	      $('#csvSelectedInvestmentIds').val(arrInvstIds.join(","));
    	}
        else
        //Incase the checkbox is unchecked the values shld be removed from hidden variable 
    	{	
    		arrInvstIds = $('#csvSelectedInvestmentIds').val().split(',');
    		
    		for(var i = arrInvstIds.length; i--;) {
  	          if(arrInvstIds[i] === $(pThis).val()) {
  	        	  arrInvstIds.splice(i, 1);
  	          }
  	      }	
    		
    	  $('#csvSelectedInvestmentIds').val(arrInvstIds.join(","));
      	}    	
    	
        //This is called here incase all checkbox are checked the 
        //select all should also be checked
    	chkIsAllChecked();


    	setParentWindowVal();
}

//Incase selectAll checkbox is ticked all the checkbox should be marked as checked.
function toggleSelectAll(source) 
{		
	  csvInvestmentIds = '';	
	  var arrInvIds = [];
		  
	  if($(source).prop('checked'))	  
	   $('.chkInvestmentClass').prop('checked', true);	  
	  else	  
	   $('.chkInvestmentClass').prop('checked', false);		   
	  
            
	  if($(source).prop('checked'))
	  {
                  //The values of all the checkbox are  added to array and
                  //moved to csv hidden variable 
		  $(".chkInvestmentClass").each(function() {		  
			  arrInvIds.push($(this).val());
		  });
		  
		  $('#csvSelectedInvestmentIds').val(arrInvIds.join(","));
	  }else		  
	    $('#csvSelectedInvestmentIds').val('');
	  
	  setParentWindowVal();	  
}


//This function is to check if all check boxes when checked
//individually the select all check box should be checked
function chkIsAllChecked()
{
 if($('.chkInvestmentClass:checked').length == $('.chkInvestmentClass').length)		  
  $('#chkSelectAll')[0].checked=true;
 else
  $('#chkSelectAll')[0].checked=false;
}

HTML Code

1. changeInvestmentIds(pThis) function is called in each checkbox when click event is carried out.
2. toggleSelectAll(source) is called when selectAll checkbox is Clicked
3. chkIsAllChecked() is called internally in changeInvestmentIds(pThis)

<table>
<thead>
<tr>
<th>
Locations
</th>
<th>
<input type="checkbox" name="chkSelectAll" value="SelectAll" styleId="selectAllChkBx" onclick="toggleSelectAll(this);"/>
</th>
<tr>
</thead>
<tbody>
 <tr>
 <td>Chennai</td>
 <td> 
  <input type="checkbox" name="chkInvestmentIds" value='Chennai' />' class="chkInvestmentClass" 
				onclick="changeInvestmentIds(this)">
</td>
</tr>
 <tr>
 <td>Bangalore</td>
 <td> 
  <input type="checkbox" name="chkInvestmentIds" value='Bangalore' />' class="chkInvestmentClass" 
				onclick="changeInvestmentIds(this)">
</td>
</tr>
 <tr>
 <td>Mumbai</td>
 <td> 
  <input type="checkbox" name="chkInvestmentIds" value='Mumbai' />' class="chkInvestmentClass" 
				onclick="changeInvestmentIds(this)">
</td>
</tr>
</tbody>
</table>