2009-09-17 4 views
3

У меня есть несколько родительских узлов. Каждый родительский узел содержит список дочерних узлов. Мои showcheckboxes установлены для всех.asp.net treeview checkbox selection

Мой вопрос:

На стороне клиента, когда я проверяю родительский узел - как я могу проверить все дочерние узлы, не делая запись назад или с помощью Ajax.

С уважением

+0

Javascript нормально? – manji

ответ

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. Это проблема ??? –

+0

Спасибо другу. Это работает 100%. – Sylar

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

+0

Не работает для меня в firefox. Я поставил такой же код, как и вы, –

+0

Этот код работает для всех, кроме меня. В чем может быть проблема. Я показываю treeview в элементе управления modelpopupextender. Неправильно –

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 –

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