RadPanelBar - Telerik ASP.NET PanelBar

  • Mail
    • Personal Folders
    • Deleted Items
    • Inbox
    • My Mail
    • Sent Items
    • Outbox
    • Search Folders
  • Calendar
  • Contacts
    • My Contacts
    • Address Cards
    • Phone List
    • Shared Contacts
  • Tasks
    • My Tasks
    • Shared Tasks
    • Active Tasks
    • Completed Tasks
  • Notes
    • My Notes
    • Notes List
    • Shared Notes
    • Archive
  • Folders List
    • My Client.Net
    • My Profile
    • My Support Tickets
    • My Licenses
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

About RadPanelBar for ASP.NET AJAX

Telerik RadPanelBar is a versatile component for building collapsible side-menu systems and Outlook-type panels. It is developed to facilitate what is found in almost any web-site - the typical left/right-side navigation, which cannot be achieved using the conventional drop-down menu components.

Navigation in your website isn't something you can afford to ignore. Telerik PanelBar control for ASP.NET AJAX offers you a professional and flexible Outlook-style navigation system with minimum coding efforts. It allows you to build collapsible side-menu systems, with cutting edge animations and limitless styling capabilities. The control's highly efficient semantic rendering guarantees fast responsive time and minimum HTML output.

RadPanelBar and 90+ other controls are part of UI for ASP.NET AJAX, a comprehensive toolset taking care of the common functionality of your application, while leaving you with more time to work on its business logic.

Key Features

  • Powerful DataBinding.
  • Rich client-side API providing the ability to add/delete items at the client-side.
  • Multi-level panels, treeview-like nesting.
  • Template Support.
  • XHTML and Accessibility standards compliancy.
  • Keyboard Support.

More about RadPanelBar for ASP.NET AJAX
  • DefaultCS.aspx
  • styles.css
<%@ Page Language="c#"  %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link rel="stylesheet" type="text/css" href="styles.css" />

    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
     <div class="demo-container size-thin">
        <telerik:RadPanelBar RenderMode="Lightweight" runat="server" ID="RadPanelBar1" Height="430px" Width="100%" ExpandMode="FullExpandedItem">
                <telerik:RadPanelItem Text="Mail" ImageUrl="images/mail.gif" Expanded="True">
                        <telerik:RadPanelItem ImageUrl="images/mailPersonalFolders.gif" Text="Personal Folders" />
                        <telerik:RadPanelItem ImageUrl="images/mailDeletedItems.gif" Text="Deleted Items" />
                        <telerik:RadPanelItem ImageUrl="images/mailInbox.gif" Text="Inbox" />
                        <telerik:RadPanelItem ImageUrl="images/mailFolder.gif" Text="My Mail" />
                        <telerik:RadPanelItem ImageUrl="images/mailSent.gif" Text="Sent Items" />
                        <telerik:RadPanelItem ImageUrl="images/mailOutbox.gif" Text="Outbox" />
                        <telerik:RadPanelItem ImageUrl="images/mailSearch.gif" Text="Search Folders" />
                <telerik:RadPanelItem Text="Calendar" ImageUrl="images/calendar.gif">
                                <telerik:RadCalendar RenderMode="Lightweight" runat="server" ID="Calendar1" Style="margin: 6px auto 0" />
                <telerik:RadPanelItem Text="Contacts" ImageUrl="images/contacts.gif">
                        <telerik:RadPanelItem ImageUrl="images/contactsItems.gif" Text="My Contacts" />
                        <telerik:RadPanelItem ImageUrl="images/contactsItems.gif" Text="Address Cards" />
                        <telerik:RadPanelItem ImageUrl="images/contactsItems.gif" Text="Phone List" />
                        <telerik:RadPanelItem ImageUrl="images/contactsItems.gif" Text="Shared Contacts" />
                <telerik:RadPanelItem Text="Tasks" ImageUrl="images/tasks.gif">
                        <telerik:RadPanelItem ImageUrl="images/tasksItems.gif" Text="My Tasks" />
                        <telerik:RadPanelItem ImageUrl="images/tasksItems.gif" Text="Shared Tasks" />
                        <telerik:RadPanelItem ImageUrl="images/tasksItems.gif" Text="Active Tasks" />
                        <telerik:RadPanelItem ImageUrl="images/tasksItems.gif" Text="Completed Tasks" />
                <telerik:RadPanelItem Text="Notes" ImageUrl="images/notes.gif">
                        <telerik:RadPanelItem ImageUrl="images/notesItems.gif" Text="My Notes" />
                        <telerik:RadPanelItem ImageUrl="images/notesItems.gif" Text="Notes List" />
                        <telerik:RadPanelItem ImageUrl="images/notesItems.gif" Text="Shared Notes" />
                        <telerik:RadPanelItem ImageUrl="images/notesItems.gif" Text="Archive" />
                <telerik:RadPanelItem Text="Folders List" ImageUrl="images/folderList.gif">
                        <telerik:RadPanelItem ImageUrl="images/mailOutbox.gif" Text="My Client.Net" />
                        <telerik:RadPanelItem ImageUrl="images/mailOutbox.gif" Text="My Profile" />
                        <telerik:RadPanelItem ImageUrl="images/mailOutbox.gif" Text="My Support Tickets" />
                        <telerik:RadPanelItem ImageUrl="images/mailOutbox.gif" Text="My Licenses" />

Find Assistance

Help Us Improve

Was this example helpful?