2009-09-17 11 views
3

J'ai plusieurs nœuds parents. Chaque nœud parent contient une liste de nœuds enfants. Mes showcheckboxes sont définies pour tous.asp.net treeview case à cocher sélection

Ma question:

Du côté client, quand je vérifie le nœud parent - comment puis-je vérifier tous les nœuds enfants sans faire un poste en arrière ou en utilisant ajax.

Cordialement

+0

javascript est ok? – manji

Répondre

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

Ajouter ce code 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

Ne fonctionne pas pour moi. Mon treeview est dans modelpopupextender. C'est un problème ??? –

+0

Merci mon ami. Cela fonctionne à 100%. – Sylar

8

solution Grande-dessus, merci beaucoup. J'ai changé la méthode CheckUncheckParents() en mes préférences: Quand l'un des fils enfants est coché, le parentnode sera également vérifié.

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

Merci, c'est un vieux fil mais m'a aidé énormément !! – bgs264

+0

Ne fonctionne pas pour moi dans firefox. J'ai copié le même code que celui que vous avez fourni –

+0

Ce code fonctionne pour tout le monde sauf moi. Quel pourrait être le problème. J'affiche l'arborescence dans le contrôle modelpopupextender. Est-ce mauvais –

1

Comme j'avais exactement le même problème que dans la question, j'ai dû changer la solution pour affecter uniquement les nœuds enfants.

<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

ne fonctionne pas dans 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; 
       } 
     } 
Questions connexes