做权限的时候,主要实现如下功能
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的值放在一个文本里,然后提交到服务器,然后服务器来解析[email protected]@这种字符
现在我使用的是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的值
新闻热点
疑难解答
图片精选
