2009-09-17 139 views
3

我有几个父节点。每个父节点都包含一个子节点列表。我的showcheckboxes设置为全部。asp.net treeview复选框选择

我的问题:

在客户端,当我检查父节点 - 我怎么能检查所有的子节点而不做回发或使用AJAX。

问候

+0

JavaScript是好吗? – manji 2009-09-17 09:07:30

回答

19
tv.Attributes.Add("onclick", "OnTreeClick(event)"); 

添加这段JavaScript代码

<script language="javascript" type="text/javascript"> 
    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; 
      if (nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node 
      { 
       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; 
    } 

</script> 
+0

不适合我。我的树视图在modelpopupextender中。这是个问题吗 ??? – 2014-02-25 04:34:25

+0

感谢朋友。这是100%的工作。 – Sylar 2015-05-24 17:54:15

8

的最佳解决方案上面,非常感谢。 我将方法CheckUncheckParents()更改为我的偏好设置:当选中其中一个子节点时,父节点也将被检查。

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; 
     if (nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node 
     { 
      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 
     { 
      checkUncheckSwitch = true; 
     } 
     else //checkbox unchecked 
     { 
      var isAllSiblingsUnChecked = AreAllSiblingsUnChecked(srcChild); 
      if (!isAllSiblingsUnChecked) 
       checkUncheckSwitch = true; 
      else 
       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 AreAllSiblingsUnChecked(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; 
} 
+0

谢谢你,这是一个古老的线索,但只是帮助我极大! – bgs264 2013-01-30 14:28:31

+0

在Firefox中不适用于我。我已经为您提供了相同的代码 – 2014-02-24 09:57:47

+0

此代码适用于除我以外的所有人。可能是什么问题。我在modelpopupextender控件中显示了treeview。它是错误的 – 2014-02-24 10:20:17

1

由于我在问题中的问题完全相同,所以必须更改解决方案以仅影响子节点。

<script language="javascript" type="text/javascript"> 
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; 
     if (nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node 
     { 
      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; 
    } 
} 


//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; 
} 

+0

不工作在Firefox – 2014-02-24 10:00:37

0
private void CheckUnCheck(object sender) 
     { 
      if ((sender as TreeView).SelectedNode.Checked == true) 
       foreach (TreeNode tr in (sender as TreeView).SelectedNode.ChildNodes) 
       { 
        foreach (TreeNode child in tr.ChildNodes) 
         child.Checked = true; 
        tr.Checked = true; 
       } 
      else 
       foreach (TreeNode tr in (sender as TreeView).SelectedNode.ChildNodes) 
       { 
        foreach (TreeNode child in tr.ChildNodes) 
         child.Checked = false; 
        tr.Checked = false; 
       } 
     }