Javascript -> Check/Uncheck gridview's checkboxes(ChildCheckbox) based on repeater's checkbox(ParentCheckbox)

Question

I have a javascript function below- In fact i have a checkbox in a repeater and a gridview inside that which again has some set of checkboxes.

I want to enable disable the gridviewCheckboxes based on the repeater checkbox selection.

so i have registered a javacript on itemsRepeater_ItemDataBound. to capture the - Which checkbox of repeater -> (RepeaterCheckBoxId) and Which GridView(Grid) as below.

function EnableDisable(RepeaterCheckboxid, Grid) {

     var grid = document.getElementById(Grid);
     if (grid == null)
         return;

     //variable to contain the cell of the grid
     var cell;

     if (grid.rows.length > 0) {
         //loop starts from 1. rows[0] points to the header.
         for (i = 1; i < grid.rows.length; i++) {
             //get the reference of first column
             cell = grid.rows[i].cells[1];

             cell.childNodes[0].checked = document.getElementById(RepeaterCheckboxid).checked;//If repeater checkbox is Unchecked then gridview checkboxes should be unchecked.* This is not working.

             cell.childNodes[0].disabled = !document.getElementById(RepeaterCheckboxid).checked; //If repeater checkbox is checked then gridViewCheckboxes are enabled and vice versa.This is working.


         }
     }
 }

But i observed that enable disable is working fine but checked unchecked is not working. How can i uncheck all the checkboxes in gridview if the repeater's checkbox is unchecked?

Please help me out if you guys have any idea.

Answer 1

Try using JQuery:

   $.each($(grid).find("tr"),function(){
        var chk = $(this).find("td:first").find(":checkbox");
        chk.attr("checked",$("#"+RepeaterCheckboxid).attr("checked"));
        chk.attr("disabled",!$("#"+RepeaterCheckboxid).attr("checked"));
    });  

Answer 2

Try like this :

cell = grid.rows[i].cells[1];
var checkedAttrib = document.createAttribute('checked');
checkedAttrib.value = document.getElementById(RepeaterCheckboxid).checked; // this will take the value from 'RepeaterCheckboxid'
cell.childNodes[0].setAttributeNode(checkedAttrib); 

Answer 3

You may need to access gridview using its ClientID like:

$('#<%=GridView1.ClientID %>')

And to get all checkboxes in gridview you can use .find("input:checkbox") and the iterate through each checkbox :

<script type="text/javascript">
function CheckUnCheckAll(chk) {
 $('#<%=GridView1.ClientID %>').find("input:checkbox").each(function () {
      if (this != chk) {
          this.checked = chk.checked;
        }
       });
  }
</script>

Call CheckUnCheckAll(this) on header checkbox with its object.

Check example here: http://www.codegateway.com/2012/05/jquery-check-uncheck-all-checkboxes-in.html