Templates Overview
RadNavigation nodes are extremely configurable. In addition to the preset skins,you can customize their appearance by adding custom images, using CSS classes, or creating custom skins. However, if you want to embed other HTMLcontrols in a navigation node, you must use templates. You can embed any content inside a NodeTemplate, including:
HTML markup
ASP.NET server controls
Other third-party controls (including other Telerik controls)
If a node has a template, it will not render an anchor (
<a>
) with theNavigateUrl
property. If you want the node to act as an anchor, you should add the desired hyperlink in the template.
At design time, add node template to your RadNavigation control:
<telerik:RadNavigation runat="server" ID="RadNavigation1" Skin="Default">
<NodeTemplate>
<asp:CheckBox ID="CheckBox1" runat="server"></asp:CheckBox>
<asp:Label ID="Label1" runat="server" Text='<%# DataBinder.Eval(Container, "Text").ToString() %>'></asp:Label>
</NodeTemplate>
<Nodes>
<telerik:NavigationNode Text="Home">
</telerik:NavigationNode>
<telerik:NavigationNode Text="Products">
<Nodes>
<telerik:NavigationNode Text="Product 1"></telerik:NavigationNode>
<telerik:NavigationNode Text="Product 2"></telerik:NavigationNode>
<telerik:NavigationNode Text="Product 3"></telerik:NavigationNode>
</Nodes>
</telerik:NavigationNode>
<telerik:NavigationNode Text="About">
</telerik:NavigationNode>
</Nodes>
</telerik:RadNavigation>