Skip to main content

BootstrapAccordion Class

Represents the web navigation bar control.

Namespace: DevExpress.Web.Bootstrap

Assembly: DevExpress.Web.Bootstrap.v24.1.dll

NuGet Package: DevExpress.Web.Bootstrap

Declaration

[DXClientDocumentationProviderWeb("BootstrapAccordion")]
[ToolboxTabName("DX.24.1: Bootstrap Controls")]
public class BootstrapAccordion :
    ASPxNavBar,
    ISimpleRenderControl

Remarks

Note

The BootstrapAccordion control provides you with comprehensive client-side functionality implemented using JavaScript code:

The control’s client-side API is enabled if the ASPxNavBar.EnableClientSideAPI property is set to true, or the ASPxNavBar.ClientInstanceName property is defined, or any client event is handled.

Example

This example demonstrates the basic functionality of the Accordion control.

The image below shows the result:

BootstrapAccordion

<dx:BootstrapAccordion runat="server">
    <Groups>
        <dx:BootstrapAccordionGroup Text="Tables">
            <Items>
                <dx:BootstrapAccordionItem Text="Users" IconCssClass="fa fa-user">
                </dx:BootstrapAccordionItem>
                <dx:BootstrapAccordionItem Text="Tasks" IconCssClass="fa fa-tasks">
                </dx:BootstrapAccordionItem>
                <dx:BootstrapAccordionItem Text="Scheduler" IconCssClass="fa fa-calendar">
                </dx:BootstrapAccordionItem>
            </Items>
        </dx:BootstrapAccordionGroup>
        <dx:BootstrapAccordionGroup Text="Analysis">
            <Items>
                <dx:BootstrapAccordionItem Text="Dashboard" IconCssClass="fa fa-dashboard">
                </dx:BootstrapAccordionItem>
                <dx:BootstrapAccordionItem Text="KPI" IconCssClass="fa fa-percent">
                </dx:BootstrapAccordionItem>
            </Items>
        </dx:BootstrapAccordionGroup>
    </Groups>
</dx:BootstrapAccordion>
See Also