Click here to Skip to main content
15,867,686 members
Articles / Web Development / IIS

Building a TreeView on Demand Using AJAX

Rate me:
Please Sign up or sign in to vote.
3.19/5 (11 votes)
27 Nov 2006CPOL4 min read 97.8K   1.1K   56  
A simple implementation of AJAX in generating a tree view from XML, ASP.NET, and C#.
//AJAXroutine - ajax common routine for the tree view implementation
//v1.01- Author: AJFK (http://www.alhamdgroup.com)
//Last updated: November 22th 06
<!--
 
var xmlHttp;
/***********************************************************
//Builds the query string and invoke a request to the server 
//using javascript async call
/***********************************************************/
function showContentsEx(div, str, lmsg){
	if (div == null) return;
	divObj = div;
		
		
	var objDivContainer = document.getElementById(eval("'"+div+"'"));
	 
	if (objDivContainer == null) return;
	
	if (str == "") {
		objDivContainer.innerHTML= "";		
		return;
	}
	//else
	//show the processing image to the user
	objDivContainer.innerHTML = "<img src='loading.gif' border='0'/>";
	
	//get the xml http object
	xmlHttp=GetXmlHttpObject()
	if (xmlHttp==null){
		alert ("Browser does not support HTTP Request")
		return
	} 
	
	//build the processing page and it's query string
	//invoke a request to the server using javascript async call
	var url="GetTreeContents.aspx?q="+str+"&d="+lmsg;
	url=url+"&sid="+Math.random();					
	xmlHttp.onreadystatechange=stateChangedEx	
	xmlHttp.open("GET",url,true)
	xmlHttp.send(null)
	/**/
}

//The extented method to check the http request state has changed
//Then the dynamic div tag will be filled with the response text
function stateChangedEx() { 
	if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete"){ 
		document.getElementById(eval("'"+divObj+"'")).innerHTML=xmlHttp.responseText 
	} 
} 

//The core function to get the xml http request object
function GetXmlHttpObject(){ 
	var objXMLHttp=null
	if (window.XMLHttpRequest){
		objXMLHttp=new XMLHttpRequest()
	}
	else if (window.ActiveXObject) {
		objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
	}
	return objXMLHttp
}

//To toggle the node image and expand collapse
function Toggle(node){
 
	// Unfold the branch if it isn't visible
	if (node.nextSibling.style)	{		
		if (node.childNodes.length > 0)	{
			if (node.childNodes.item(0).nodeName == "IMG"){
				if(node.childNodes.item(0).src.indexOf("plus.gif")> -1){
					
					node.nextSibling.style.display = 'block';
					node.childNodes.item(0).src = "minus.gif";
					return true;
				}
				else {
				
					node.nextSibling.style.display = 'none';
					node.childNodes.item(0).src = "plus.gif";
					return false;
				}				 
			}
		}		
	}
}
//-->

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Web Developer
United States United States
AJFK (Abduljaleel Faisel kakkidi) is an IT Consultant in US. He has been developing and designing MS Client server and Web solutions since 1997. His expertise lies in developing scalable, high-performance Web solutions for various fields. Hobbies include teaching, and reading books. AJ Kakkidi has a Bachelor of Physics, and Masters of Computer Applications. He can be reached at ajkakkidi at yahoo.com.

Comments and Discussions