JavaScript - Check/Uncheck Tree view check boxes using Javascript

This is my tree view control

<asp:TreeView ID="tvNodes" runat="server" ShowCheckBoxes="Leaf" >
</asp:TreeView>

I want to check/uncheck all check boxes by a button click.

Any javascript code/articles you have?

Hi,

I dont have much experience in this aspect. But anyhow, i was able to find few links which lead to solution. Hope they might help you to find a solution.

There are 6 pages in this discussion forum. Go through it carefully. They have provided the solution for various cases:  http://forums.asp.net/p/976122/2268524.aspx

http://geekswithblogs.net/ranganh/archive/2006/03/25/73300.aspx

http://forums.asp.net/t/1255649.aspx

Hope this solves your query. All the Best..!!

Rakesh Vikram

check this link for the solution of yours..

http://www.dotnetspider.com/forum/ViewForum.aspx?ForumId=36868

Hello

You can use this code
If(!isPostBack)
{
    TreeView1.Attributes.Add("onclick","OnTreeClick(event)");
}
Now OnTreeClick(event) function contains the following code and sub function

function OnTreeClick(evt)
{
var src = window.event != window.undefined ? window.event.srcElement : evt.target;
var isChkBoxClick = (src.tagName.toLowerCase() == "input" && src.type == "checkbox");
if(isChkBoxClick)
{
     var parentTable = GetParentByTagName("table", src);
     var nxtSibling = parentTable.nextSibling;
     //check if nxt sibling is not null & is an element node
      if(nxtSibling && nxtSibling.nodeType == 1)
     {
         if(nxtSibling.tagName.toLowerCase() == "div") //if node has children
         {
             //check or uncheck children at all levels
             CheckUncheckChildren(parentTable.nextSibling, src.checked);
         }
     }
//check or uncheck parents at all levels
CheckUncheckParents(src, src.checked);
}
}

function CheckUncheckChildren(childContainer, check)
{
var childChkBoxes = childContainer.getElementsByTagName("input");
      var childChkBoxCount = childChkBoxes.length;
for(var i=0;i<childChkBoxCount;i++)
{
     childChkBoxes[i].checked = check;
}
}

function CheckUncheckParents(srcChild, check)
{
var parentDiv = GetParentByTagName("div", srcChild);
var parentNodeTable = parentDiv.previousSibling;
if(parentNodeTable)
{
     var checkUncheckSwitch;
     if(check) //checkbox checked
     {
         var isAllSiblingsChecked = AreAllSiblingsChecked(srcChild);
         if(isAllSiblingsChecked)
                 checkUncheckSwitch = true;
         else
                 return; //do not need to check parent if any(one or more) child not checked
     }
     else //checkbox unchecked
     {
         checkUncheckSwitch = false;
     }
  
     var inpElemsInParentTable = parentNodeTable.getElementsByTagName("input");
     if(inpElemsInParentTable.length > 0)
     {
         var parentNodeChkBox = inpElemsInParentTable[0];
         parentNodeChkBox.checked = checkUncheckSwitch;
         //do the same recursively
        CheckUncheckParents(parentNodeChkBox, checkUncheckSwitch);
     }
}
}

function AreAllSiblingsChecked(chkBox)
{
var parentDiv = GetParentByTagName("div", chkBox);
var childCount = parentDiv.childNodes.length;
for(var i=0;i<childCount;i++)
{
     if(parentDiv.childNodes[i].nodeType == 1)
     {
         //check if the child node is an element node
         if(parentDiv.childNodes[i].tagName.toLowerCase() == "table")
         {
             var prevChkBox = parentDiv.childNodes[i].getElementsByTagName("input")[0];
             //if any of sibling nodes are not checked, return false
             if(!prevChkBox.checked)
             {
                 return false;
             }
         }
     }
}
return true;
}

//utility function to get the container of an element by tagname
function GetParentByTagName(parentTagName, childElementObj)
{
var parent = childElementObj.parentNode;
while(parent.tagName.toLowerCase() != parentTagName.toLowerCase())
     {
         parent = parent.parentNode;
     }
return parent;
}

Refer this link
http://pushpontech.blogspot.com/2007/06/treeview-checkuncheck-all-script.html

Happy Coding takecare