هنا، يتم استخدام عنصر تحكم TreeView لـ asp.net2.0 مع JavaScript لتنفيذ بعض وظائف شجرة الأذونات.
افترض أن هناك القواعد الثلاث التالية في شجرة الأذونات:
1. إذا كانت العقدة قابلة للوصول، فيجب أن تكون العقدة الأصلية قابلة للوصول أيضًا؛
2. إذا كان من الممكن الوصول إلى العقدة، فيمكن أيضًا الوصول إلى العقد الفرعية الخاصة بها؛
3. إذا تعذر الوصول إلى العقدة، فلن يمكن الوصول إلى العقد الفرعية الخاصة بها أيضًا.
الرمز هو كما يلي:
// احصل على العنصر الأصلي للعلامة المحددة
الوظيفة public_GetParentByTagName(العنصر، tagName)
{
varparent = element.parentNode;
var UpperTagName = tagName.toUpperCase();
// إذا لم يكن هذا العنصر هو العلامة المطلوبة، فتابع التتبع
بينما (الوالد && (parent.tagName.toUpperCase()!= UpperTagName))
{
parent =parent.parentNode ?parent.parentNode :parent.parentElement;
}
عودة الوالدين؛
}
// قم بتعيين العقدة الأصلية للعقدة Cheched - إذا كان من الممكن الوصول إلى العقدة، فيجب أيضًا الوصول إلى العقدة الأصلية
الدالة setParentChecked(objNode)
{
var objParentDiv = public_GetParentByTagName(objNode,"div");
إذا (objParentDiv==null || objParentDiv == "غير محدد")
{
يعود؛
}
var objID = objParentDiv.getAttribute("ID");
objID = objID.substring(0,objID.indexOf("العقد"));
objID = objID+"CheckBox";
var objParentCheckBox = document.getElementById(objID);
إذا (objParentCheckBox==null || objParentCheckBox == "غير محدد")
{
يعود؛
}
إذا (objParentCheckBox.tagName!="INPUT" && objParentCheckBox.type == "مربع الاختيار")
يعود؛
objParentCheckBox.checked = true;
setParentChecked(objParentCheckBox);
}
// قم بتعيين العقدة الفرعية للعقدة غير محددة - إذا كانت العقدة غير قابلة للوصول، فلن يمكن الوصول إلى العقد الفرعية الخاصة بها أيضًا.
الدالة setChildUnChecked(divID)
{
var objchild = divID.children;
var count = objchild.length;
for(var i=0;i<objchild.length;i++)
{
var tempObj = objchild[i];
إذا (tempObj.tagName = "INPUT" && tempObj.type == "مربع الاختيار")
{
tempObj.checked = false;
}
setChildUnChecked(tempObj);
}
}
// قم بتعيين العقدة الفرعية للعقدة - إذا كان من الممكن الوصول إلى العقدة، فيمكن أيضًا الوصول إلى العقد الفرعية الخاصة بها
وظيفة setChildChecked (divID)
{
var objchild = divID.children;
var count = objchild.length;
for(var i=0;i<objchild.length;i++)
{
var tempObj = objchild[i];
إذا (tempObj.tagName = "INPUT" && tempObj.type == "مربع الاختيار")
{
tempObj.checked = true;
}
setChildChecked(tempObj);
}
}
// حدث التشغيل
الدالة CheckEvent()
{
var objNode = events.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");
إذا (objParentDiv==null || objParentDiv == "غير محدد")
{
يعود؛
}
setChildChecked(objParentDiv);
}
آخر
{
var objID = objNode.getAttribute("ID");
var objID = objID.substring(0,objID.indexOf("CheckBox"));
var objParentDiv = document.getElementById(objID+"Nodes");
إذا (objParentDiv==null || objParentDiv == "غير محدد")
{
يعود؛
}
setChildUnChecked(objParentDiv);
}
}
ثم قم بربط TreeView بالحدث js في حدث page_load:
this.TreeView1.Attributes.Add("onclick", "CheckEvent()");