做權限的時候,主要實現如下功能
1、該節點可以訪問,則他的父節點也必能訪問;
2、該節點可以訪問,則他的子節點也都能訪問;
3.該節點不可訪問,則他的子節點也不能訪問。
使用帶有CheckBox的數型結構能得到很好的用戶體驗,可是編程的難度也是有點增加,如果全部有服務端來完成,那點下刷下,肯定不行,只能使用javascript,javascript調試的時候鬱悶的很,一個字類,還有鬱悶的遞歸,麻煩我以前是使用以下該方法
<script language="javascript">
<!--
//初始化節點
initchecknode(document.all("tvItemClientID").value,document.all("checked").value)
//初始化選取節點
function initchecknode(tree,tvvalue)
{
//取得需要初始化選擇狀態的節點的字串.
var selectedNodes = tvvalue;
var arrayNodes = new Array();
arrayNodes = selectedNodes.split(",");
var AllRootNode=new Array();
AllRootNode=document.getElementById(tree).getChildren();
//初始化選擇的節點
findAndCheckedNodes(AllRootNode,arrayNodes);
}
//根據已選取的節點的字串初始化所選取的節點
function findAndCheckedNodes(NodeArray,nodeDatas)
{
//alert(NodeArray.length);
if(parseInt(NodeArray.length)==0)
{
return;
}
else
{
for(var i=0;i<parseInt(NodeArray.length);i++)
{
var cNode,nodeData;
cNode=NodeArray[i];
////如果該節點在nodeDatas裡則初始化checked = true;
nodeData = cNode.getAttribute("NodeData");
for(var j=0;j<nodeDatas.length;j++)
{
if(nodeDatas[j] == nodeData)
{
cNode.setAttribute("checked","true");
break;
}
}
//如果有子節點,則繼續遞迴
if(parseInt(cNode.getChildren().length)!=0)
findAndCheckedNodes(cNode.getChildren(),nodeDatas);
}
}
}
//-->
//oncheck事件
function tree_oncheck(tree)
{
var i;
var node=tree.getTreeNode(tree.clickedNodeIndex);
var Pchecked=tree.getTreeNode(tree.clickedNodeIndex).getAttribute("checked");
setcheck(node,Pchecked);
setParent(node,Pchecked);
//window.alert(Pchecked);
document.all.checked.value = "";
if (tree.getChildren().length > 0)
{
for (i=0;i<=tree.getChildren().length-1;i++)
{
if (tree.getChildren()[i].getAttribute("Checked"))
{
AddChecked(tree.getChildren()[i]);
}
FindCheckedFromNode(tree.getChildren()[i]);
}
}
}
//設定子節點選取
function setcheck(node,Pchecked)
{
var i;
var ChildNode=new Array();
ChildNode=node.getChildren();
if(parseInt(ChildNode.length)==0)
{
return;
}
else
{
for(i=0;i<ChildNode.length;i++)
{
var cNode;
cNode=ChildNode[i];
cNode.setAttribute("Checked",Pchecked);
//cNode.Checked = Pchecked;
if(parseInt(cNode.getChildren().length)!=0)
{
setcheck(cNode,Pchecked);
}
}
}
}
//設定子節點選取/取消;
//同時需要設定父節點的狀態(如果是取消選取的話,僅僅設定本節點及其所有字接點,不涉及父接點)
function setParent(node,Pc)
{
var parentNode = node.getParent();
if(parentNode)
{
var parentNodeFather = parentNode.getParent();
if(parentNodeFather)
{
setParent(parentNode,Pc);
}
if(Pc)
{parentNode.setAttribute("checked",Pc);}
else
{
checkBrother(parentNode,Pc,node.getAttribute("NodeData"))
}
}
}
//檢查子接點是否有選擇的,如果有一個選擇了,那回傳true
//只查第一級節點.
function checkBrother(parentNode,Pc,NodeData)
{
var childNodes = new Array();
childNodes = parentNode.getChildren();
if(childNodes.length >0)
{
var bChecked = true;
for(var i=0;i<childNodes.length;i++)
{
if(childNodes[i].getAttribute("checked") == true && childNodes[i].getAttribute("NodeData") != NodeData)
{
//alert(i+childNodes[i].getAttribute("Text"));
bChecked = false;
break;
}
}
if(bChecked)
{
parentNode.setAttribute("checked",Pc);
}
else
{
//所有父結點選擇
setParent(parentNode,!Pc)
}
}
else
{
parentNode.setAttribute("checked",Pc);
}
}
//取得所有節點狀態
function FindCheckedFromNode(node)
{
var i = 0;
var nodes = new Array();
nodes = node.getChildren();
for (i = 0; i <= nodes.length - 1; i++)
{
if (nodes[i].getAttribute("Checked"))
{
AddChecked(nodes[i]);
}
if (parseInt(nodes[i].getChildren().length) != 0 )
{
FindCheckedFromNode(nodes[i]);
}
}
}
//新增選取節點
function AddChecked(node)
{
document.all.checked.value += node.getAttribute("NodeData") + ",";
}
//-->
</script>這種方法有個很大的問題,就是他客戶端設定的CheckBox在伺服器端是不能取得的,現在只能在Check的時候遍歷樹,並把Checked的值放在一個文字裡,然後提交到伺服器,然後伺服器來解析1@2 @這種字符
現在我使用的是asp.net2.0,使用的是以下的方法
function public_GetParentByTagName(element, tagName)
{
var parent = element.parentNode;
var upperTagName = tagName.toUpperCase();
//如果這個元素還不是想要的tag就繼續上溯
while (parent && (parent.tagName.toUpperCase() != upperTagName))
{
parent = parent.parentNode ? parent.parentNode : parent.parentElement;
}
return parent;
}
//設定節點的父節點Cheched-該節點可訪問,則他的父節點也必能訪問
function setParentChecked(objNode)
{
var objParentDiv = public_GetParentByTagName(objNode,"div");
if(objParentDiv==null || objParentDiv == "undefined")
{
return;
}
var objID = objParentDiv.getAttribute("ID");
objID = objID.substring(0,objID.indexOf("Nodes"));
objID = objID+"CheckBox";
var objParentCheckBox = document.getElementById(objID);
if(objParentCheckBox==null || objParentCheckBox == "undefined")
{
return;
}
if(objParentCheckBox.tagName!="INPUT" && objParentCheckBox.type == "checkbox")
return;
objParentCheckBox.checked = true;
setParentChecked(objParentCheckBox);
}
//設定節點的子節點uncheched-該節點不可訪問,則他的子節點也不能訪問
function setChildUnChecked(divID)
{
var objchild = divID.children;
var count = objchild.length;
for(var i=0;i<objchild.length;i++)
{
var tempObj = objchild[i];
if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox")
{
tempObj.checked = false;
}
setChildUnChecked(tempObj);
}
}
//設定節點的子節點cheched-該節點可以訪問,則他的子節點也都能訪問
function setChildChecked(divID)
{
var objchild = divID.children;
var count = objchild.length;
for(var i=0;i<objchild.length;i++)
{
var tempObj = objchild[i];
if(tempObj.tagName=="INPUT" && tempObj.type == "checkbox")
{
tempObj.checked = true;
}
setChildChecked(tempObj);
}
}
//觸發事件
function CheckEvent()
{
var objNode = event.srcElement;
if(objNode.tagName!="INPUT" || objNode.type!="checkbox")
return;
if(objNode.checked==true)
{
setParentChecked(objNode);
var objID = objNode.getAttribute("ID");
var objID = objID.substring(0,objID.indexOf("CheckBox"));
var objParentDiv = document.getElementById(objID+"Nodes");
if(objParentDiv==null || objParentDiv == "undefined")
{
return;
}
setChildChecked(objParentDiv);
}
else
{
var objID = objNode.getAttribute("ID");
var objID = objID.substring(0,objID.indexOf("CheckBox"));
var objParentDiv = document.getElementById(objID+"Nodes");
if(objParentDiv==null || objParentDiv == "undefined")
{
return;
}
setChildUnChecked(objParentDiv);
}
}這種方法最大的好處就是服務端能得javascript設定的Checked的值,不用沒點下就全部把樹遍利下,直接在服務端遍利一次就行了
//遍歷子節點
public void GetChildNode(TreeNode Node)
{
foreach (TreeNode node in Node.ChildNodes)
{
if (node.Checked)
{
StrChecked += node.Value+"@";
}
GetChildNode(node);
}
}
}我照樣能得到它的Check的值