Introduction to TreeView in ASP. NET

Although the TreeView control of ASP. NET 2.0 has powerful functions, its client control is inferior. This article describes the implementation principle of the TreeView client and implements two personalized operations:

(1) Open and Close all nodes;
Client Side Expand/Collapse All Nodes For ASP. NET 2.0 TreeView.

(2) open only one node (close other sibling nodes ).
Just one expanded node in ASP. NET 2.0 TreeView (When a client expand one node all other will collaps)
Use NotePad to open the page source code. You can find two script references:

 
 

  
  
<script src="/WebUI/WebResource.axd?d=RAQeBcDUNuP9iuS8q3tNEw2&amp;
t=633300220640000000" type="text/javascript"></script> 
  
  
<script src="/WebUI/WebResource.axd?d=JuTdJhq3NM8Jq_RhssAkEg2&amp;
t=633300220640000000" type="text/javascript"></script> 
 
 

Set "/WebUI/WebResource. axd? D = RAQeBcDUNuP9iuS8q3tNEw2 & amp; t = 633300220640000000 "copy to the end of the address bar, download the script, and name it in. js. The other operation is the same. After analyzing the second script file, we can see many client functions of TreeView. The key TreeView_ToggleNode is the event triggered when the client clicks.

To perform personalized operations, you must start with the TreeView_ToggleNode event. We cannot change the. net encapsulated script, but only "Rewrite ". The so-called rewrite is to add a function with the same name after the original function because js only calls the last function with the same name ).

The original function of TreeView_ToggleNode:

 
 

  
  
function TreeView_ToggleNode(data, index, node, lineType, children) {  
  
  
var img = node.childNodes[0];  
  
  
var newExpandState;  
  
  
try {  
  
  
if (children.style.display == "none") {  
  
  
children.style.display = "block";  
  
  
newExpandState = "e";  
  
  
if ((typeof(img) != "undefined") && (img != null)) {  
  
  
if (lineType == "l") {  
  
  
img.src = data.images[15];  
  
  
}  
  
  
else if (lineType == "t") {  
  
  
img.src = data.images[12];  
  
  
}  
  
  
else if (lineType == "-") {  
  
  
img.src = data.images[18];  
  
  
}  
  
  
else {  
  
  
img.src = data.images[5];  
  
  
}  
  
  
img.alt = data.collapseToolTip.replace(/\{0\}/, TreeView_GetNodeText(node));  
  
  
}  
  
  
}  
  
  
else {  
  
  
children.style.display = "none";  
  
  
newExpandState = "c";  
  
  
if ((typeof(img) != "undefined") && (img != null)) {  
  
  
if (lineType == "l") {  
  
  
img.src = data.images[14];  
  
  
}  
  
  
else if (lineType == "t") {  
  
  
img.src = data.images[11];  
  
  
}  
  
  
else if (lineType == "-") {  
  
  
img.src = data.images[17];  
  
  
}  
  
  
else {  
  
  
img.src = data.images[4];  
  
  
}  
  
  
img.alt = data.expandToolTip.replace(/\{0\}/, TreeView_GetNodeText(node));  
  
  
}  
  
  
}  
  
  
}  
  
  
catch(e) {}  
  
  
datadata.expandState.value =  data.expandState.value.substring(0, index) + 
newExpandState + data.expandState.value.slice(index + 1);  
  
  
} 
 
 

1. ASP. NET TypeConverter
2. Analysis on TypeResolver of ASP. NET
3. Define JavaScriptConverter in ASP. NET
4. How to replace Sys. Services in ASP. NET
5. Use Profile Service of ASP. NET AJAX