ASP.NET 4 Unleased - p 109 pot

Displaying Check Boxes with the TreeView Control You can display check boxes next to each node in a TreeView control by assigning a value to the ShowCheckBoxes property.. The page in Lis

Trang 1

You selected:

<asp:Label

id=”lblMessage”

EnableViewState=”false”

Runat=”server” />

</div>

</form>

</body>

</html>

The page in Listing 22.19 includes a SelectedNodeChanged event handler When you select

a new node, the SelectedNodeChanged event handler displays the value of the selected

TreeNode in a Label control

Displaying Check Boxes with the TreeView Control

You can display check boxes next to each node in a TreeView control by assigning a value

to the ShowCheckBoxes property This property accepts the following values:

All

Leaf

None

Parent

Root

You can use a bitwise combination of these values when specifying the nodes to display

with check boxes

The page in Listing 22.20 illustrates the ShowCheckBoxes property (see Figure 22.17)

Trang 2

<%@ Page Language=”C#” %>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN”

“http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>

protected void btnSubscribe_Click(object sender, EventArgs e)

{

foreach (TreeNode node in TreeView1.CheckedNodes)

bltSubscribed.Items.Add(node.Text);

}

</script>

<title>TreeView CheckBoxes</title>

</head>

<body>

<div>

Trang 3

Select the Newsgroups which you

would like to join:

<br />

<asp:TreeView

id=”TreeView1”

ShowCheckBoxes=”Leaf”

Runat=”server”>

<Nodes>

<asp:TreeNode

Text=”Programming”>

<asp:TreeNode Text=”ASP.NET” />

<asp:TreeNode Text=”JAVA” />

<asp:TreeNode Text=”Cold Fusion” />

</asp:TreeNode>

<asp:TreeNode

Text=”Sports”>

<asp:TreeNode Text=”Baseball” />

<asp:TreeNode Text=”Hockey” />

<asp:TreeNode Text=”Football” />

</asp:TreeNode>

</Nodes>

</asp:TreeView>

<br />

<asp:Button

id=”btnSubscribe”

Text=”Subscribe”

OnClick=”btnSubscribe_Click”

<hr />

You selected:

<asp:BulletedList

id=”bltSubscribed”

EnableViewState=”false”

</div>

</form>

</body>

</html>

Trang 4

The page in Listing 22.20 displays nested newsgroups You can subscribe to the

news-groups by clicking the Subscribe button

When you click the Subscribe button, the CheckedNodes property returns a list of all the

checked TreeNodes This list displays in a BulletedList control

Binding to a Site Map

You can use a TreeView control as a navigation element in your pages by binding the

TreeView to a Site Map The page in Listing 22.21 demonstrates how you can bind a

TreeView to a SiteMapDataSource control (see Figure 22.18)

<title>TreeView Site Map</title>

</head>

<body>

<div>

Trang 5

<asp:TreeView

id=”TreeView1”

DataSourceID=”srcSiteMap”

<asp:SiteMapDataSource

id=”srcSiteMap”

</div>

</form>

</body>

</html>

When you open the page in Listing 22.21, all the nodes from the Site Map display

auto-matically in the TreeView control By default, the SiteMapDataSource uses the

XmlSiteMapProvider, which represents a file named Web.sitemap located at the root of an

application

NOTE

You can add a TreeView and SiteMapDataSource control to a Master Page to show

the TreeView in multiple pages To learn more about Master Pages, see Chapter 5

Binding to an XML File

Because an XmlDataSource control returns hierarchical data, you can bind a TreeView

directly to an XmlDataSource For example, imagine that you need to display the XML

document contained in Listing 22.22

<?xml version=”1.0” encoding=”utf-8” ?>

</action>

</horror>

</movies>

Trang 6

The page in Listing 22.23 illustrates how you can display the contents of this XML

docu-ment with a TreeView control

<title>TreeView XML</title>

</head>

<body>

<div>

<asp:TreeView

id=”TreeView1”

DataSourceID=”srcMovies”

<asp:XmlDataSource

id=”srcMovies”

DataFile=”~/Movies.xml”

</div>

</form>

</body>

</html>

The Movies.xml document in Listing 22.22 is extremely simple The elements do not

include any attributes You can display more complicated XML documents with the

TreeView control by declaring one or more TreeNodeBinding elements

For example, the nodes in the XML document in Listing 22.24 include id and text

attributes

<?xml version=”1.0” encoding=”utf-8” ?>

</category>

Trang 7

</category>

</movies>

The page in Listing 22.25 displays the contents of the XML document in Listing 22.24

<title>TreeView XML Complex</title>

</head>

<body>

<div>

<asp:TreeView

id=”TreeView1”

DataSourceID=”srcMovies”

Runat=”server”>

<asp:TreeNodeBinding

DataMember=”category”

TextField=”text”

ValueField=”id” />

<asp:TreeNodeBinding

DataMember=”movie”

TextField=”text”

ValueField=”id” />

</DataBindings>

</asp:TreeView>

<asp:XmlDataSource

id=”srcMovies”

DataFile=”~/MoviesComplex.xml”

</div>

</form>

</body>

</html>

Trang 8

The TreeView in Listing 22.25 includes a DataBindings subtag This tag includes two

TreeNodeBinding elements The first TreeNodeBinding specifies the relationship between

<category> nodes in the XML document and TreeView nodes The second

TreeNodeBinding specifies the relationship between <movie> nodes and TreeView nodes

Binding to Database Data

You cannot bind a TreeView control directly to a SqlDataSource or ObjectDataSource

control because neither of these two controls exposes hierarchical data If you want to

display database data with the TreeView control, you have a choice: create a custom

SqlHierarchicalDataSource control or programmatically bind the TreeView to the

database data

The hard option is to build a SQL hierarchical DataSource control You can do this by

deriv-ing a new control from the base HierarchicalDataSourceControl class or by implementing

the IHierarchicalDataSource interface We explore this option in the final section

The second option is to build the TreeView control programmatically from a set of

data-base records This is the approach that we follow in this section

Imagine that you have a database table that looks like this:

MessageId ParentId Subject

1 null How do you use the Menu control?

2 null What is the TreeView control?

3 1 RE:How do you use the Menu

control?

4 1 RE:How do you use the Menu

control?

5 2 RE:What is the TreeView control?

6 5 RE:RE:What is the TreeView control?

This database table represents a discussion forum The relationship between the messages

is determined by the ParentId column The messages that have a null ParentID represent

the threads, and the other messages represent replies to the threads

The page in Listing 22.26 uses a TreeView control to display the contents of the Discuss

database table (see Figure 22.19)

Trang 9

<%@ Import Namespace=”System.Web.Configuration” %>

<%@ Import Namespace=”System.Data” %>

<%@ Import Namespace=”System.Data.SqlClient” %>

/// <summary>

/// Only populate the TreeView when the page first loads

/// </summary>

void Page_Load()

{

if (!Page.IsPostBack)

PopulateTreeView();

}

/// <summary>

/// Get the data from the database and create the top-level

/// TreeView items

/// </summary>

Trang 10

private void PopulateTreeView()

{

DataTable treeViewData = GetTreeViewData();

AddTopTreeViewNodes(treeViewData);

}

/// <summary>

/// Use a DataAdapter and DataTable to grab the database data

/// </summary>

/// <returns></returns>

private DataTable GetTreeViewData()

{

// Get Discuss table

string selectCommand = “SELECT MessageId,ParentId,Subject FROM Discuss”;

string conString =

WebConfigurationManager.ConnectionStrings[“Discuss”].ConnectionString;

SqlDataAdapter dad = new SqlDataAdapter(selectCommand, conString);

DataTable dtblDiscuss = new DataTable();

dad.Fill(dtblDiscuss);

return dtblDiscuss;

}

/// <summary>

/// Filter the data to get only the rows that have a

/// null ParentID (these are the top-level TreeView items)

/// </summary>

private void AddTopTreeViewNodes(DataTable treeViewData)

{

DataView view = new DataView(treeViewData);

view.RowFilter = “ParentID IS NULL”;

foreach (DataRowView row in view)

{

TreeNode newNode = new TreeNode(row[“Subject”].ToString(),

row[“MessageId”].ToString());

TreeView1.Nodes.Add(newNode);

AddChildTreeViewNodes(treeViewData, newNode);

}

/// <summary>

/// Recursively add child TreeView items by filtering by ParentID

/// </summary>

private void AddChildTreeViewNodes(DataTable treeViewData,

TreeNode parentTreeViewNode)

{

Định dạng
Số trang	10
Dung lượng	541,58 KB