5. How do I add CSS or JavaScript from the contents page
dynamically? [top]
Page class contains a public property named Header. You can convert HTML head tag to the corresponding server control by adding runat=”server” to its definition. Then you can access the head tag in code behind:
HtmlLinkcssLink = newHtmlLink();
cssLink.Href =
"~/css.css";
cssLink.Attributes.Add("rel",
"stylesheet");
cssLink.Attributes.Add("type",
"text/css");
Header.Controls.Add(cssLink);
HtmlLinkjsLink = newHtmlLink();
jsLink.Href =
"~/js.js";
jsLink.Attributes.Add("language",
"javascript");
jsLink.Attributes.Add("type",
"text/javascript");
Header.Controls.Add(jsLink);
Now run the application and view the html source of the page:
A theme is a collection of property settings that allow you to define the look of pages and controls, and then apply the look consistently across pages in a Web application, across an entire
Web application, or across all Web applications on a server. Themes are made up of a set of elements: skins, cascading style sheets (CSS), images, and other resources. At a minimum, a theme will contain skins. Themes are defined in special directories in your
Web site or on your Web server.
A skin file has the file name extension .skin and contains property settings for individual controls
such as Button,
Label,
TextBox,
or Calendar
controls. Control skin settings are like the control markup itself, but contain only the properties you want to set as part of the theme.
Please refer to following link for more information:
We can programmatically set the theme for a page, but the Theme property must be set in the PreInit event of a page. This is because the skins in a Theme are applied after the PreInit event but before the Init event.
11.
How do I expand or collapse all TreeNodes with JavaScript?
[top]
We can expand and collapse all TreeNodes on the server side, but it needs a post back. To avoid this, we can use JavaScript.
In the sample code below, the function “TreeviewExpandCollapseAll” is used to demonstrate how to expand or collapse a TreeView. The function takes two parameters, the first parameter “treeViewId” is the TreeView control’s ID,
and the second parameter “expandAll” is used to determine whether or not to expand the TreeView control.
12.
How do I check/uncheck TreeNodes checkbox?[top]
When we set ShowCheckBoxes="All", we would like to provide a feature if people select the Root Node’s checkbox, then all its child nodes’ checkboxes are checked automatically.
When the parent node is checked, all the child nodes should check automatically; when one child node is unchecked, the parent node should be unchecked.
In the functions below:
<!--[if !supportLists]-->·<!--[endif]-->OnTreeClick:
used to check parent and child node
<!--[if !supportLists]-->·<!--[endif]-->CheckUncheckChildren:
used to check or uncheck the child node
<!--[if !supportLists]-->·<!--[endif]-->CheckUncheckParents:
used to check or uncheck the parent node
<!--[if !supportLists]-->·<!--[endif]-->AreAllSiblingsChecked:used
to check all siblings node
<!--[if !supportLists]-->·<!--[endif]-->GetParentByTagName:
used to get parent tag name
14.
How do I add a confirmation dialog for each TreeNode?
[top]
Normally, the current page will be redirected to another page directly when you click on a TreeNode. If you want to popup a confirmation dialog before redirecting, you can use following code:
FAQ Publishe...
0 Points
12 Posts
Master Pages, Themes and Navigation Controls FAQ
May 13, 2009 07:41 AM|LINK
MasterPage
1. How do I begin?
2. How do I get control on the master page from the contents page?
3. How do I use a strongly typed reference to master page in the contents page?
4. How do I add HtmlMeta from the contents page?
5. How do I add CSS or JavaScript from the contents page dynamically?
6. How do I change the master page at runtime?
7. How do I use nested master page?
Themes and Skins
8. What are themes and skins?
9. How do I change themes dynamically?
Navigation controls
10. How do I access all TreeNodes in a TreeView control?
11. How do I expand or collapse all of TreeNodes with JavaScript?
12. How do I check/uncheck TreeNodes checkbox?
13. How do I generate a TreeView based on the folder structure?
14. How do I add a confirm dialog for each TreeNode?
15. How do I add Master Pages on the existing web forms?
16. How do I build a TreeView by using AJAX?
17. How do I use multiple sitemap files in ASP.NET 2.0?
MasterPage: [top]
1. How do I begin to use master page? [top]
Below are the tips and tricks to use master pages to their full potential:
http://www.odetocode.com/Articles/450.aspx
2. How do I get control on the master page from the contents page? [top]
Master page markup code:
<form id="form1" runat="server">
<asp:Label ID="lblMessage" runat="server" Text="I am a MasterPage"></asp:Label>
<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
Content page code-behind:
(Page.Master.FindControl("lblMsg") as Label).Text = "I Love ASP.NET!";
Related threads:
http://forums.asp.net/p/1371287/2867278.aspx
http://forums.asp.net/p/1367012/2843903.aspx
http://forums.asp.net/p/1353270/2776218.aspx
http://forums.asp.net/p/1324661/2641317.aspx
3. How do I use a strongly typed reference to master page in the contents page? [top]
Place a @ MasterType directive in the content page.. For example, see the following markup code of master page:
<form id="form1" runat="server">
<asp:Label ID="lblMessage" runat="server" Text="I am a MasterPage"></asp:Label>
<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
Code-behind:
public string Message
{
get { return lblMessage.Text; }
set { lblMessage.Text = value; }
}
Markup code of content page:
<%@ Page Title="" Language="C#" MasterPageFile=”~/MasterPage.master” %>
<%@ MasterType VirtualPath="~/MasterPage.master" %>
Code-behind:
Related threads,
http://forums.asp.net/t/915582.aspx
http://forums.asp.net/t/1267232.aspx
http://forums.asp.net/t/1217417.aspx
http://forums.asp.net/p/1174398/1980954.aspx
http://forums.asp.net/p/609559/620839.aspx
http://forums.asp.net/p/1358205/2794157.aspx
4. How do I add HtmlMeta from the contents page? [top]
See the following code:
HtmlMeta metaTag = new HtmlMeta();
metaTag.Name = "keywords";
metaTag.Content = "ASP.NET,C#,VB";
Header.Controls.Add(metaTag);
Run the application and view the html source, you will find following content:
Related threads,
http://forums.asp.net/p/1385135/2942780.aspx
http://forums.asp.net/p/1007704/1381203.aspx
http://forums.asp.net/p/1340962/2715956.aspx
http://forums.asp.net/p/1385201/2943162.aspx
http://forums.asp.net/p/1357221/2789468.aspx
http://forums.asp.net/p/1217546/2170120.aspx
5. How do I add CSS or JavaScript from the contents page dynamically? [top]
Page class contains a public property named Header. You can convert HTML head tag to the corresponding server control by adding runat=”server” to its definition. Then you can access the head tag in code behind:
HtmlLink cssLink = new HtmlLink();
cssLink.Href = "~/css.css";
cssLink.Attributes.Add("rel", "stylesheet");
cssLink.Attributes.Add("type", "text/css");
Header.Controls.Add(cssLink);
HtmlLink jsLink = new HtmlLink();
jsLink.Href = "~/js.js";
jsLink.Attributes.Add("language", "javascript");
jsLink.Attributes.Add("type", "text/javascript");
Header.Controls.Add(jsLink);
Now run the application and view the html source of the page:
<link href="css.css" rel="stylesheet" type="text/css" />
<link href="js.js" language="javascript" type="text/javascript" />
Related threads,
http://forums.asp.net/t/1377840.aspx
http://forums.asp.net/t/1274180.aspx
http://forums.asp.net/t/812415.aspx
http://forums.asp.net/t/1167113.aspx
http://forums.asp.net/t/1023605.aspx
http://forums.asp.net/p/1259642/2350917.aspx
http://forums.asp.net/p/974674/2185721.aspx
http://forums.asp.net/p/1011033/2899195.aspx
http://forums.asp.net/p/1063197/1537104.aspx
http://forums.asp.net/p/1207405/2129938.aspx
6. How do I change the master page at runtime? [top]
Use following code:
protected void Page_PreInit(object sender, EventArgs e)
{
if (Session["user"] == null)
this.Page.MasterPageFile = "~/MasterPage2.master";
else
this.Page.MasterPageFile = "~/MasterPage1.master";
}
The key here is to put the code in Page_PreInit.
Related threads,
http://forums.asp.net/t/1170081.aspx
http://forums.asp.net/t/1260175.aspx
http://forums.asp.net/t/986565.aspx
http://forums.asp.net/t/1294163.aspx
http://forums.asp.net/p/1140254/1832376.aspx
7. How do I use nested master page? [top]
Following code will show how to implement nested master page step by step:
parent.master markup code:
<% @ Master Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML
1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="Form1" runat="server">
<div>
<h1>
Parent Master</h1>
<p style="font: color=red">
This is parent master content.</p>
<asp:ContentPlaceHolder ID="MainContent" runat="server" />
</div>
</form>
</body>
</html>
child.master markup code:
<%@ Master Language="C#" MasterPageFile="~/parent .master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<asp:Panel runat="server" ID="panelMain" BackColor="lightyellow">
<h2>
Child master</h2>
<asp:Panel runat="server" ID="panel1" BackColor="lightblue">
<p>
This is child master content.</p>
<asp:ContentPlaceHolder ID="ChildContent1" runat="server" />
</asp:Panel>
<asp:Panel runat="server" ID="panel2" BackColor="pink">
<p>
This is child master content.</p>
<asp:ContentPlaceHolder ID="ChildContent2" runat="server" />
</asp:Panel>
<br />
</asp:Panel>
</asp:Content>
child.aspx markup code:
<%@ Page Language="C#" MasterPageFile="~/child.master" %>
<asp:Content ID="Content1" ContentPlaceHolderID="ChildContent1" runat="server">
<asp:label runat="server" id="Label1" text="Child label1" font-bold="true" />
<br />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ChildContent2" runat="server">
<asp:label runat="server" id="Label2" text="Child label2" font-bold="true" />
</asp:Content>
Related threads,
http://forums.asp.net/t/1059255.aspx
http://forums.asp.net/t/1270231.aspx
http://forums.asp.net/t/923612.aspx
http://forums.asp.net/p/1338093/2701349.aspx
http://forums.asp.net/p/1345334/2733082.aspx
Themes and Skins [top]
8. What are themes and skins? [top]
A theme is a collection of property settings that allow you to define the look of pages and controls, and then apply the look consistently across pages in a Web application, across an entire Web application, or across all Web applications on a server. Themes are made up of a set of elements: skins, cascading style sheets (CSS), images, and other resources. At a minimum, a theme will contain skins. Themes are defined in special directories in your Web site or on your Web server.
A skin file has the file name extension .skin and contains property settings for individual controls such as Button, Label, TextBox, or Calendar controls. Control skin settings are like the control markup itself, but contain only the properties you want to set as part of the theme.
Please refer to following link for more information:
http://msdn.microsoft.com/en-us/library/ykzx33wh.aspx
9. How do I change themes dynamically? [top]
We can programmatically set the theme for a page, but the Theme property must be set in the PreInit event of a page. This is because the skins in a Theme are applied after the PreInit event but before the Init event.
protected void Page_PreInit(object sender, EventArgs e)
{
string thm;
thm = (string)Session["themeSelected"];
if (thm != null)
{
Page.Theme = thm;
DropDownList1.Text = thm;
}
else
{
Session["themeSelected"] = DropDownList1.Text;
Page.Theme = "Blue";
}
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
Session["themeSelected"] = DropDownList1.Text;
Server.Transfer(Request.FilePath);
}
Related threads:
http://forums.asp.net/t/1094690.aspx
http://forums.asp.net/t/879808.aspx
http://forums.asp.net/t/1138835.aspx
http://forums.asp.net/p/1106977/1695768.aspx
http://forums.asp.net/p/1383293/2936429.aspx
http://forums.asp.net/p/1363437/2822860.aspx
Navigation controls [top]
10. How do I access all TreeNodes in a TreeView control? [top]
We can use a recursive function to do this, please refer to following code:
protected void Page_Load(object sender, EventArgs e)
{
foreach (TreeNode node in tvDemo.Nodes)
{
SetNode(node);
}
}
void SetNode(TreeNode node)
{
if (node.Depth != 0)
{
//some code
}
if (node.ChildNodes.Count > 0)
{
foreach (TreeNode childnode in node.ChildNodes)
{
SetNode(childnode);
}
}
}
Related threads:
http://forums.asp.net/t/1378432.aspx
http://forums.asp.net/p/1374742/2885991.aspx
http://forums.asp.net/p/1362784/2820103.aspx
11. How do I expand or collapse all TreeNodes with JavaScript? [top]
We can expand and collapse all TreeNodes on the server side, but it needs a post back. To avoid this, we can use JavaScript.
In the sample code below, the function “TreeviewExpandCollapseAll” is used to demonstrate how to expand or collapse a TreeView. The function takes two parameters, the first parameter “treeViewId” is the TreeView control’s ID, and the second parameter “expandAll” is used to determine whether or not to expand the TreeView control.
See the complete code below:
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>TreeView Demo</title>
<script language="javascript" type="text/javascript">
function TreeviewExpandCollapseAll(treeViewId, expandAll) {
var displayState = (expandAll == true ? "none" : "block");
var treeView = document.getElementById(treeViewId);
if (treeView) {
var treeLinks = treeView.getElementsByTagName("a");
var nodeCount = treeLinks.length;
for (i = 0; i < nodeCount; i++) {
if (treeLinks[i].firstChild.tagName) {
if (treeLinks[i].firstChild.tagName.toLowerCase() == "img") {
var currentToggleLink = treeLinks[i];
var childContainer = GetParentByTagName("table", currentToggleLink).nextSibling;
if (childContainer.style.display == displayState) {
eval(currentToggleLink.href);
}
}
}
}
}
}
function GetParentByTagName(parentTagName, childElementObj) {
var parent = childElementObj.parentNode;
while (parent.tagName.toLowerCase() != parentTagName.toLowerCase()) {
parent = parent.parentNode;
}
return parent;
} </script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="TreeViewDemo" runat="server" ExpandDepth="1">
<Nodes>
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A" Value="A">
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A1" Value="A1">
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A11" Value="A11"></asp:TreeNode>
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A12" Value="A12"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A2" Value="A2">
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A21" Value="A21"></asp:TreeNode>
<asp:TreeNode NavigateUrl="http://www.asp.net" Text="A22" Value="A22"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
<a href="javascript:TreeviewExpandCollapseAll('<%=TreeViewDemo.ClientID%>', true)">Expand
All</a> <a href="javascript:TreeviewExpandCollapseAll('<%=TreeViewDemo.ClientID%>', false)">
Collapse All</a>
</div>
</form>
</body>
</html>
Related threads:
http://forums.asp.net/p/1355481/2779144.aspx
http://forums.asp.net/p/1359189/2799350.aspx
12. How do I check/uncheck TreeNodes checkbox? [top]
When we set ShowCheckBoxes="All", we would like to provide a feature if people select the Root Node’s checkbox, then all its child nodes’ checkboxes are checked automatically.
When the parent node is checked, all the child nodes should check automatically; when one child node is unchecked, the parent node should be unchecked.
In the functions below:
<!--[if !supportLists]--> · <!--[endif]-->OnTreeClick: used to check parent and child node
<!--[if !supportLists]--> · <!--[endif]-->CheckUncheckChildren: used to check or uncheck the child node
<!--[if !supportLists]--> · <!--[endif]-->CheckUncheckParents: used to check or uncheck the parent node
<!--[if !supportLists]--> · <!--[endif]-->AreAllSiblingsChecked:used to check all siblings node
<!--[if !supportLists]--> · <!--[endif]-->GetParentByTagName: used to get parent tag name
See the complete code below:
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
TreeViewDemo.Attributes.Add("onclick", "OnTreeClick(event)");
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>TreeView</title>
<script language="javascript" type="text/javascript">
//************************** Treeview Parent-Child check behavior ****************************//
function OnTreeClick(evt)
{
var src = window.event != window.undefined ? window.event.srcElement : evt.target;
var isChkBoxClick = (src.tagName.toLowerCase() == "input" && src.type == "checkbox");
if(isChkBoxClick)
{
var parentTable = GetParentByTagName("table", src);
var nxtSibling = parentTable.nextSibling;
if(nxtSibling && nxtSibling.nodeType == 1)//check if nxt sibling is not null & is an element node
{
if(nxtSibling.tagName.toLowerCase() == "div") //if node has children
{
//check or uncheck children at all levels
CheckUncheckChildren(parentTable.nextSibling, src.checked);
}
}
//check or uncheck parents at all levels
CheckUncheckParents(src, src.checked);
}
}
function CheckUncheckChildren(childContainer, check)
{
var childChkBoxes = childContainer.getElementsByTagName("input");
var childChkBoxCount = childChkBoxes.length;
for(var i = 0; i<childChkBoxCount; i++)
{
childChkBoxes[i].checked = check;
}
}
function CheckUncheckParents(srcChild, check)
{
var parentDiv = GetParentByTagName("div", srcChild);
var parentNodeTable = parentDiv.previousSibling;
if(parentNodeTable)
{
var checkUncheckSwitch;
if(check) //checkbox checked
{
var isAllSiblingsChecked = AreAllSiblingsChecked(srcChild);
if(isAllSiblingsChecked)
checkUncheckSwitch = true;
else
return; //do not need to check parent if any child is not checked
}
else //checkbox unchecked
{
checkUncheckSwitch = false;
}
var inpElemsInParentTable = parentNodeTable.getElementsByTagName("input");
if(inpElemsInParentTable.length > 0)
{
var parentNodeChkBox = inpElemsInParentTable[0];
parentNodeChkBox.checked = checkUncheckSwitch;
//do the same recursively
CheckUncheckParents(parentNodeChkBox, checkUncheckSwitch);
}
}
}
function AreAllSiblingsChecked(chkBox)
{
var parentDiv = GetParentByTagName("div", chkBox);
var childCount = parentDiv.childNodes.length;
for(var i=0; i<childCount; i++)
{
if(parentDiv.childNodes[i].nodeType == 1) //check if the child node is an element node
{
if(parentDiv.childNodes[i].tagName.toLowerCase() == "table")
{
var prevChkBox = parentDiv.childNodes[i].getElementsByTagName("input")[0];
//if any of sibling nodes are not checked, return false
if(!prevChkBox.checked)
{
return false;
}
}
}
}
return true;
}
//utility function to get the container of an element by tagname
function GetParentByTagName(parentTagName, childElementObj)
{
var parent = childElementObj.parentNode;
while(parent.tagName.toLowerCase() != parentTagName.toLowerCase())
{
parent = parent.parentNode;
}
return parent;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="TreeViewDemo" runat="server" ShowCheckBoxes="All">
<Nodes>
<asp:TreeNode Text="My Computer">
<asp:TreeNode Text="Favorites">
<asp:TreeNode Text="News">
<asp:TreeNode Text="MSN" NavigateUrl="http://www.msn.com" />
<asp:TreeNode Text="MSNBC News" NavigateUrl="http://www.msnbc.msn.com" />
</asp:TreeNode>
<asp:TreeNode Text="Technology">
<asp:TreeNode Text="Microsoft" NavigateUrl="http://www.microsoft.com" />
<asp:TreeNode Text="ASP.NET" NavigateUrl="http://www.asp.net" />
<asp:TreeNode Text="GotDotNet" NavigateUrl="http://www.gotdotnet.com" />
<asp:TreeNode Text="MSDN" NavigateUrl="http://msdn.microsoft.com" />
</asp:TreeNode>
<asp:TreeNode Text="Shopping">
<asp:TreeNode Text="MSN Shopping" NavigateUrl="http://shopping.msn.com" />
<asp:TreeNode Text="MSN Autos" NavigateUrl="http://autos.msn.com" />
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="City Links">
<asp:TreeNode Text="MapPoint" NavigateUrl="http://www.mappoint.com" />
<asp:TreeNode Text="MSN City Guides" NavigateUrl="http://local.msn.com" />
</asp:TreeNode>
<asp:TreeNode Text="Music Links">
<asp:TreeNode Text="MSN Music" NavigateUrl="http://music.msn.com" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
</form>
</body>
</html>
Related threads:
http://forums.asp.net/t/1367074.aspx
http://forums.asp.net/t/976122.aspx
http://forums.asp.net/t/1088627.aspx
13. How do I generate a TreeView based on the folder structure? [top]
Please see following example:
<!--[if !supportLists]--> · <!--[endif]--> SetNodes: used to change the navigation URL by iterating through all nodes
<!--[if !supportLists]--> · <!--[endif]--> OutputDirectory: used to output a directory to a node
<!--[if !supportLists]--> · <!--[endif]-->ConvertFileToRelativePaths: used to convert the path
<!--[if !supportLists]--> · <!--[endif]-->GenerateDirectoryTree: used to generate a directory tree
<!--[if !supportLists]--> · <!--[endif]-->BindDirectoryToDropDownList: used to bind directories to the DropDownList control
Markup code (MyWebsiteTreeView.aspx):
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MyWebsiteTreeView.aspx.cs"
Inherits="MyWebsiteTreeView" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="TreeView1" runat="server">
</asp:TreeView>
<asp:DropDownList ID="ddlRootDirectory" runat="server">
</asp:DropDownList>
<asp:Button ID="btnGenerateDirectoryTree" runat="server" Text="Ggenerate Directory Tree"
onclick="btnGenerateDirectoryTree_Click" />
</div>
</form>
</body>
</html>
Behind code (MyWebsiteTreeView.aspx.cs):
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
public partial class MyWebsiteTreeView : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
BindDirectoryToDropDownList(ddlRootDirectory);
}
}
/// <summary>
/// Change the tree
/// </summary>
/// <param name="node"></param>
void SetNodes(TreeNode node)
{
string ab = node.NavigateUrl;
node.NavigateUrl = node.NavigateUrl.Replace("FAQ\\", "");//FAQ is the directory name
node.NavigateUrl = node.NavigateUrl.Replace("\\", "/");//For Firefox and IE
if (node.ChildNodes.Count > 0)
{
foreach (TreeNode childNode in node.ChildNodes)
{
SetNodes(childNode);
}
}
}
/// <summary>
/// Output Directory to a node
/// </summary>
/// <param name="directory"></param>
/// <param name="parentNode"></param>
/// <returns></returns>
TreeNode OutputDirectory(System.IO.DirectoryInfo directory, TreeNode parentNode)
{
// validate param
if (directory == null) return null;
// create a node for this directory
TreeNode DirNode = new TreeNode(directory.Name);
// get subdirectories of the current directory
System.IO.DirectoryInfo[] SubDirectories = directory.GetDirectories();
// output each subdirectory
for (int DirectoryCount = 0; DirectoryCount < SubDirectories.Length; DirectoryCount++)
{
OutputDirectory(SubDirectories[DirectoryCount], DirNode);
}
// output the current directories files
System.IO.FileInfo[] Files = directory.GetFiles();
for (int FileCount = 0; FileCount < Files.Length; FileCount++)
{
//if (Files[FileCount].Extension == ".htm")
//{
string filename = ConvertFileToRelativePaths(Files[FileCount].FullName, "FAQ");//FAQ is the directory name
DirNode.ChildNodes.Add(new TreeNode(Files[FileCount].Name, Files[FileCount].Name, "", filename, "_blank"));
//}
}
// if the parent node is null, return this node
// otherwise add this node to the parent and return the parent
if (parentNode == null)
{
return DirNode;
}
else
{
parentNode.ChildNodes.Add(DirNode);
return parentNode;
}
}
/// <summary>
/// Convert File To Relative Paths
/// </summary>
/// <param name="fileName"></param>
/// <param name="rootName"></param>
/// <returns></returns>
string ConvertFileToRelativePaths(string fileName, string rootName)
{
return fileName.Substring(fileName.LastIndexOf(rootName));
}
/// <summary>
/// Generate Directory Tree
/// </summary>
/// <param name="tv"></param>
void GenerateDirectoryTree(TreeView tv)
{
tv.Nodes.Clear();
System.IO.DirectoryInfo RootDir = new System.IO.DirectoryInfo(Server.MapPath("~/" + ddlRootDirectory.SelectedValue + "/"));
//set the root as "~/"
if (ddlRootDirectory.SelectedValue == "Root")
{
RootDir = new System.IO.DirectoryInfo(Server.MapPath("~/"));
}
// output the directory into a node
TreeNode RootNode = OutputDirectory(RootDir, null);
// add the output to the tree
TreeView1.Nodes.Add(RootNode);
foreach (TreeNode node in tv.Nodes)
{
SetNodes(node);
}
}
/// <summary>
/// bind data to DropDownList
/// </summary>
/// <param name="ddl"></param>
void BindDirectoryToDropDownList(DropDownList ddl)
{
ddl.Items.Clear();
System.IO.DirectoryInfo RootDir = new System.IO.DirectoryInfo(Server.MapPath("~/"));
System.IO.DirectoryInfo[] SubDirectories = RootDir.GetDirectories();
ddl.Items.Add("Root");
foreach (DirectoryInfo dir in SubDirectories)
{
ddl.Items.Add(dir.Name);
}
}
/// <summary>
/// Generate the tree
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
protected void btnGenerateDirectoryTree_Click(object sender, EventArgs e)
{
GenerateDirectoryTree(TreeView1);
}
}
Related threads:
http://forums.asp.net/p/1378432/2920430.aspx
http://forums.asp.net/p/1364377/2828536.aspx
14. How do I add a confirmation dialog for each TreeNode? [top]
Normally, the current page will be redirected to another page directly when you click on a TreeNode. If you want to popup a confirmation dialog before redirecting, you can use following code:
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
string confirmMessage = "Yes/No?";
// write a function for popup a confirm dialog
string script = @"function treeNodeConfirmation(mEvent, text)
{
var o;
// Internet Explorer
if (mEvent.srcElement)
{
o = mEvent.srcElement;
}
// Netscape and Firefox
else if (mEvent.target)
{
o = mEvent.target;
}
if(o.tagName == 'A' || o.tagName == 'a')
{
return confirm (text);
}
}";
// regist the function
ScriptManager.RegisterClientScriptBlock(myTreeView, typeof(TreeView), "treeNodeClickConfirm", script, true);
// add the function to the TreeView’s Attributes
// it means when the client users click the TreeNodes, it will popup a confirm // dialog.
myTreeView.Attributes.Add("onclick", "javascript:return treeNodeConfirmation(event, '" + confirmMessage + "')");
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Demo</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TreeView ID="myTreeView" runat="server">
<Nodes>
<asp:TreeNode Text="My Computer">
<asp:TreeNode Text="Favorites">
<asp:TreeNode Text="News">
<asp:TreeNode Text="MSN" NavigateUrl="http://www.msn.com" />
<asp:TreeNode Text="MSNBC News" NavigateUrl="http://www.msnbc.msn.com" />
</asp:TreeNode>
<asp:TreeNode Text="Technology">
<asp:TreeNode Text="Microsoft" NavigateUrl="http://www.microsoft.com" />
<asp:TreeNode Text="ASP.NET" NavigateUrl="http://www.asp.net" />
<asp:TreeNode Text="GotDotNet" NavigateUrl="http://www.gotdotnet.com" />
<asp:TreeNode Text="MSDN" NavigateUrl="http://msdn.microsoft.com" />
</asp:TreeNode>
<asp:TreeNode Text="Shopping">
<asp:TreeNode Text="MSN Shopping" NavigateUrl="http://shopping.msn.com" />
<asp:TreeNode Text="MSN Autos" NavigateUrl="http://autos.msn.com" />
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="City Links">
<asp:TreeNode Text="MapPoint" NavigateUrl="http://www.mappoint.com" />
<asp:TreeNode Text="MSN City Guides" NavigateUrl="http://local.msn.com" />
</asp:TreeNode>
<asp:TreeNode Text="Music Links">
<asp:TreeNode Text="MSN Music" NavigateUrl="http://music.msn.com" />
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
</form>
</body>
</html>
Related threads:
http://forums.asp.net/t/1020789.aspx
http://forums.asp.net/t/1355481.aspx
http://forums.asp.net/p/1353925/2771697.aspx
http://forums.asp.net/p/1353925/2790985.aspx
15. How do I add Master Pages on the existing web forms? [top]
For more information refer to following link:
http://forums.asp.net/t/1244510.aspx
16. How do I build a TreeView by using AJAX? [top]
For more information refer to following link:
http://www.codeproject.com/KB/aspnet/TreeViewAjax.aspx
17. How do I use multiple sitemap files in ASP.NET 2.0? [top]
For more information refer to following link:
http://www.codeproject.com/KB/aspnet/MutlipleSiteMap.aspx