Skip to main content
Tab

TreeViewNode.Template Property

Gets or sets a template used for displaying the content of the particular node.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v24.2.dll

NuGet Package: DevExpress.Web

#Declaration

[DefaultValue(null)]
public virtual ITemplate Template { get; set; }

#Property Value

Type Default Description
ITemplate null

An object supporting the System.Web.UI.ITemplate interface which contains the template used for displaying the node’s content.

#Remarks

Use the Template property to control the contents of the particular node. The template defined using this property replaces the content of a node - in particular, the node’s check box, image and specified text.

In order to define a common content for all nodes within an ASPxTreeView control, the ASPxTreeView.NodeTemplate property can be used.

Note

Once a template defined by this property is created, it is instantiated within a container represented by the TreeViewNodeTemplateContainer class. The TreeViewNodeTemplateContainer class implements a set of properties which can be useful when designing a template and binding the controls composing this template to data.

#Example

This example demonstrates how you can create templates.

<dx:ASPxTreeView ID="ASPxTreeView1" runat="server" Width="386px" Height="354px">
    <NodeTextTemplate>
          <b><%# Eval("Text") %></b>
          <br><%# Eval("Name") %>
    </NodeTextTemplate>
    <Nodes>
        <dx:TreeViewNode>
            <Nodes>
                <dx:TreeViewNode Name="ASPxHTMLEditor? Suite" Text="HTML Editor for ASP.NET">
                    <Image Url="~/Images/ASPxHtmlEditor.png">
                    </Image>
                </dx:TreeViewNode>
                <dx:TreeViewNode Name="ASPxMenu? " Text="Menu for ASP.NET">
                    <Image Url="~/Images/ASPxMenu.png">
                    </Image>
                </dx:TreeViewNode>
                <dx:TreeViewNode Name="ASPxEditors? Library" Text="Data Editors for ASP.NET">
                    <Image Url="~/Images/ASPxEditors.png">
                    </Image>
                </dx:TreeViewNode>
            </Nodes>
            <Template>
                <dx:ASPxRoundPanel ID="ASPxRoundPanel1" runat="server" Width="277px" ShowHeader="False" Font-Bold="True">
                    <PanelCollection>
                        <dx:PanelContent runat="server">
                            <table>
                               <tr>
                               <td style="height: 52px">
                                  <img src="Images/asp.png" />
                               <td style="height: 52px">
                                 <span style="font-size: 12pt;">
                                ASP.NET AJAX Controls</span>
                            </table></dx:PanelContent>
                    </PanelCollection>
                </dx:ASPxRoundPanel>
           </Template>
        </dx:TreeViewNode>
        <dx:TreeViewNode>
            <Nodes>
                <dx:TreeViewNode Name="XtraGrid? Suite " Text="Grid and Data Editors for WinForms">
                    <Image Url="~/Images/XtraGrid.png">
                    </Image>
                </dx:TreeViewNode>
                <dx:TreeViewNode Name="XtraPivotGrid? Suite " Text="OLAP Data Mining Control for WinForms">
                    <Image Url="~/Images/XtraPivotGrid.png">
                    </Image>
                </dx:TreeViewNode>
                <dx:TreeViewNode Name="XtraTreeList? Suite " Text="TreeView-Grid Hybrid for WinForms">
                    <Image Url="~/Images/XtraTreeList.png">
                    </Image>
                </dx:TreeViewNode>
            </Nodes>
             <Template>
                <dx:ASPxRoundPanel ID="ASPxRoundPanel2" runat="server" Width="239px" ShowHeader="False" Font-Bold="True" Height="48px">
                    <PanelCollection>
                        <dx:PanelContent runat="server">
                            <table>
                               <tr>
                               <td style="height: 54px">
                                 <img src="Images/win.png" />
                               <td style="height: 54px">
                                 <span style="font-size: 12pt;">
                                 WinForms Controls </span>
                            </table></dx:PanelContent>
                    </PanelCollection>
                </dx:ASPxRoundPanel>
            </Template>
        </dx:TreeViewNode>
    </Nodes>
    <Styles>
        <NodeImage>
            <Paddings Padding="2px" />
        </NodeImage>
    </Styles>
</dx:ASPxTreeView>
protected void Page_Load(object sender, EventArgs e) {
    ASPxTreeView1.ExpandAll();
}
See Also