ASPxNavBar.ItemTemplate Property
Gets or sets a common template used for displaying the content of all items within the navbar control.
Namespace: DevExpress.Web
Assembly: DevExpress.Web.v19.2.dll
Declaration
[DefaultValue(null)]
public virtual ITemplate ItemTemplate { get; set; }
<DefaultValue(Nothing)>
Public Overridable Property ItemTemplate As ITemplate
Property Value
| Type |
Default |
Description |
| ITemplate |
*null* |
An object supporting the System.Web.UI.ITemplate interface which contains the template used for displaying the content of all items within the navbar.
|
Use the ItemTemplate property to define a common content for all items within the current navbar control. The template created using this property replaces the content of each item within the navbar - in particular, the item’s image and text specified.
Note that any style settings defined for the items via the specific properties (such as the ASPxNavBar.ItemStyle or NavBarGroup.ItemStyle) are still in effect for the items whose contents are specified through using the ItemTemplate property.
The content of items within a particular group can be defined using the group’s NavBarGroup.ItemTemplate property.
Note
Once a template defined via the ItemTemplate property is created within a control, it is instantiated within a container object of the NavBarItemTemplateContainer type. This container object exposes a set of specific properties to which the template’s child controls can be bound.
Example
This example demonstrates how to bind the ASPxNavBar control to the XmlDataSource. This example also shows how to work with GroupHeaderTemplate and ItemTemplate templates.
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partial class ASPxperience_NavBar_Binding_Binding : System.Web.UI.Page {
protected void Page_Load(object sender, EventArgs e) {
}
}
<?xml version="1.0" encoding="utf-8"?>
<Cameras>
<Brand Text="Olympus">
<Camera NavigateUrl="javascript:void(21);" Text="Olympus E-400 (10.0 million pixels)" />
<Camera NavigateUrl="javascript:void(22);" Text="Olympus E-330 (7.4 million pixels)" />
<Camera NavigateUrl="javascript:void(23);" Text="Olympus E-500 (8.0 million pixels)" />
<Camera NavigateUrl="javascript:void(24);" Text="Olympus E-300 (8.0 million pixels)" />
</Brand>
<Brand Text="Pentax">
<Camera NavigateUrl="javascript:void(41);" Text="Pentax K10D (10.0 million pixels)" />
<Camera NavigateUrl="javascript:void(42);" Text="Pentax K100D (6.1 million pixels)" />
<Camera NavigateUrl="javascript:void(43);" Text="Pentax *ist DL2 (6.1 million pixels)" />
</Brand>
</Cameras>
<%-- BeginRegion Page setup --%>
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="ASPxperience_NavBar_Binding_Binding" %>
<%@ Register Assembly="DevExpress.Web.v8.1" Namespace="DevExpress.Web.ASPxNavBar" TagPrefix="dxnb" %>
<%-- EndRegion --%>
<!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>How to bind the ASPxNavBar control</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<dxnb:ASPxNavBar ID="nbNavBar" runat="server" DataSourceID="XmlDataSource1" Width="250px">
<GroupHeaderTemplate>
<strong style="color: #F82F61;">
<%# !string.IsNullOrEmpty(Container.Group.Name) ? Container.Group.Name : Container.Group.Text %>
</strong>
</GroupHeaderTemplate>
<ItemTemplate>
<div style="border: 1px dashed #F82F61; padding: 2px 8px; cursor: pointer;" onclick="window.location = '<%# Container.Item.NavigateUrl %>';">
<a href="<%# Container.Item.NavigateUrl %>">
<%# Container.Item.Text %>
</a>
</div>
</ItemTemplate>
</dxnb:ASPxNavBar>
<%-- Data Source --%>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/NavBarCameras.xml" XPath="Cameras/*" />
</div>
</form>
</body>
</html>
<%-- BeginRegion Page setup --%>
<%@ Page Language="vb" AutoEventWireup="true" CodeFile="Default.aspx.vb" Inherits="ASPxperience_NavBar_Binding_Binding" %>
<%@ Register Assembly="DevExpress.Web.v8.1" Namespace="DevExpress.Web.ASPxNavBar" TagPrefix="dxnb" %>
<%-- EndRegion --%>
<!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>How to bind the ASPxNavBar control</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<dxnb:ASPxNavBar ID="nbNavBar" runat="server" DataSourceID="XmlDataSource1" Width="250px">
<GroupHeaderTemplate>
<strong style="color: #F82F61;">
<%#IIf((Not String.IsNullOrEmpty(Container.Group.Name)), Container.Group.Name, Container.Group.Text)%>
</strong>
</GroupHeaderTemplate>
<ItemTemplate>
<div style="border: 1px dashed #F82F61; padding: 2px 8px; cursor: pointer;" onclick="window.location = '<%#Container.Item.NavigateUrl%>';">
<a href="<%#Container.Item.NavigateUrl%>">
<%#Container.Item.Text%>
</a>
</div>
</ItemTemplate>
</dxnb:ASPxNavBar>
<%-- Data Source --%>
<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/App_Data/NavBarCameras.xml" XPath="Cameras/*" />
</div>
</form>
</body>
</html>
<?xml version="1.0" encoding="utf-8"?>
<Cameras>
<Brand Text="Olympus">
<Camera NavigateUrl="javascript:void(21);" Text="Olympus E-400 (10.0 million pixels)" />
<Camera NavigateUrl="javascript:void(22);" Text="Olympus E-330 (7.4 million pixels)" />
<Camera NavigateUrl="javascript:void(23);" Text="Olympus E-500 (8.0 million pixels)" />
<Camera NavigateUrl="javascript:void(24);" Text="Olympus E-300 (8.0 million pixels)" />
</Brand>
<Brand Text="Pentax">
<Camera NavigateUrl="javascript:void(41);" Text="Pentax K10D (10.0 million pixels)" />
<Camera NavigateUrl="javascript:void(42);" Text="Pentax K100D (6.1 million pixels)" />
<Camera NavigateUrl="javascript:void(43);" Text="Pentax *ist DL2 (6.1 million pixels)" />
</Brand>
</Cameras>
Imports Microsoft.VisualBasic
Imports System
Imports System.Data
Imports System.Configuration
Imports System.Collections
Imports System.Web
Imports System.Web.Security
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Web.UI.WebControls.WebParts
Imports System.Web.UI.HtmlControls
Partial Public Class ASPxperience_NavBar_Binding_Binding
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)
End Sub
End Class
See Also