Telerik UI for ASP.NET Core PanelBar Basic Usage

The Telerik UI for ASP.NET Core PanelBar is a multi-level component that allows users to expand and collapse its items. The PanelBar enables you to create a nice, accordion-like collapsible structure with hierarchical data.

You have full control over the PanelBar items and can display them as icons, images, HTML markup, or Kendo UI Templates. Also, based on your scenario, the component can bind to remote or local data.

As an expandable component, the PanelBar supports animation effects when the items are expanded or collapsed through user interaction.

The current demo shows a PanelBar with four sections that include images and text, and a drop-down list of options within one of the panels, and also demonstrates how to use properties such as ExpandMode, Expanded, and Enabled.

The ASP.NET Core PanelBar component is part of Telerik UI for ASP.NET Core, a professional-grade UI library with 110+ components for building modern and feature-rich web applications. The UI for ASP.NET Core PanelBar is a server-side wrapper for the Kendo UI for jQuery PanelBar component and supports an HtmlHelper and a TagHelper mode.

Functionality and Features

• Data binding—Declare all items within the helper declaration, or use AJAX or server binding.
• Expand modes—Expand only a single item or enable the multiple expand mode to expand multiple items at a time.
• Images—Include images or sprite icons in the PanelBar items.
• Templates—Customize the appearance of the PanelBar items through templates.
• Animations—Enable the animation effects when expanding or collapsing PanelBar items.
• Events—Subscribe to the PanelBar events to implement any custom logic when a specified item is selected, expanded, collapsed, and so on.
• API—Take advantage of the variety of client-side API methods of the component.
• Accessibility and keyboard navigation—The PanelBar is accessible for screen readers, supports WAI-ARIA attributes, and delivers keyboard shortcuts for faster navigation.
• RTL support—The PanelBar enables you to render its content in a right-to-left direction.

This PanelBar example is part of unique collection of hundreds of ASP.NET Core demos, with which you can see all Telerik ASP.NET Core components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for ASP.NET Core or ThemeBuilder.