ImageUrl Property

TreeNode.ImageUrl Property

 

Gets or sets the URL to an image that is displayed next to the node.

Namespace:   System.Web.UI.WebControls
Assembly:  System.Web (in System.Web.dll)

Public Property ImageUrl As String

Property Value

Type: System.String

The URL to a custom image that is displayed next to the node. The default value is an empty string (""), which indicates that this property is not set.

Use the ImageUrl property to specify a custom image for the current node in the TreeView control. This image is displayed next to the node and can be in any file format (.jpg, .gif, .bmp, and so on), as long as the client's browser supports that format.

The value of this property is stored in view state.

The following code example demonstrates how to use the ImageUrl property to provide a custom image for a node. For this example to work correctly, you must copy the sample XML data below to a file named Book.xml.


<%@ Page Language="VB" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

  Sub Data_Bound(ByVal sender As Object, ByVal e As TreeNodeEventArgs)

    ' Give the Chapter 2 node a custom image. 
    If e.Node.Text = "Chapter 2" Then

      e.Node.ImageUrl = "Custom.jpg"

    End If

  End Sub

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
  <head runat="server">
    <title>TreeView TreeNodeDataBound Example</title>
</head>
<body>
    <form id="form1" runat="server">

      <h3>TreeView TreeNodeDataBound Example</h3>

      <asp:TreeView id="BookTreeView" 
        DataSourceID="BookXmlDataSource"
        LeafNodeStyle-ImageUrl="Leaf.jpg"
        ParentNodeStyle-ImageUrl="Parent.jpg"
        RootNodeStyle-ImageUrl="Root.jpg"   
        OnTreeNodeDataBound="Data_Bound"
        runat="server">

        <DataBindings>
          <asp:TreeNodeBinding DataMember="Book" TextField="Title"/>
          <asp:TreeNodeBinding DataMember="Chapter" TextField="Heading"/>
          <asp:TreeNodeBinding DataMember="Section" TextField="Heading"/>
        </DataBindings>

      </asp:TreeView>

      <asp:XmlDataSource id="BookXmlDataSource"  
        DataFile="Book.xml"
        runat="server">
      </asp:XmlDataSource>

    </form>
  </body>
</html>

The following code is sample XML data for the previous example.

<Book Title="Book Title">
    <Chapter Heading="Chapter 1">
        <Section Heading="Section 1">
        </Section>
        <Section Heading="Section 2">
        </Section>
    </Chapter>
    <Chapter Heading="Chapter 2">
        <Section Heading="Section 1">
        </Section>
    </Chapter>
</Book>

.NET Framework
Available since 2.0
Return to top
Show:
© 2016 Microsoft